I am simply trying to display some custom messaging on success/failure scenario.
.subrcribe (
success => {
this.clear();
this.success("<img>First sentence.<br><img>Second sentence!");
},
err => {
this.error("error");
}
)
everything works fine, no syntax errors or anything. I know there is a way to display custom html in success/failure scenario. when I do it the way mentioned above, the message is displayed in a single line like..
" < img > First sentence. < br > < img >Second sentence!" like a text.
Any inputs? thankyou, in advance.
Related
I am using a complex object whose values are represented with Blazor. Among others there is a list of strings. Some strings contain a bullet, but these are represented as rectangles.
How can I manipulate the display so that the bullets are displayed?
My string:
razor file:
#for (int i = 0; i < #item.Highlight.Count() && i < 5; i++)
{
<div class="searchHighlight">#((MarkupString)#item.Highlight[i])</div>
}
The bulled at the html page:
You could replace • with the HTML equivalent •
#for (int i = 0; i < #item.Highlight.Count() && i < 5; i++)
{
<div class="searchHighlight">#((MarkupString)#item.Highlight[i].Replace("•", "•"))</div>
}
Then casting it as MarkupString should render it properly.
I've tried to imitate the same string data as you have, and, unfortunately, I could not reproduce this issue. It is pretty hard to tell where is the problem: CSS, fonts, metatags, string itself or something else. Anyways, according to the positive reaction to Waragi's suggestion, you could try some of these options:
Try to put bullet point HTML Unicode outside of your razor parentheses, like this:
<div class="searchHighlight">•#((MarkupString)item?.Highlight.Replace("•", ""))</div>
Also, you can avoid adding a bullet point HTML Unicode above by adding some styles to searchHighlight:
<div class="searchHighlight">#item?.Highlight.Replace("•", "")</div>
<style>
.searchHighlight::before {
content: "\2022";
}
</style>
I hope it helps!
I would like to implement an infinite scroll populated by a very big json, within Angular 5. The idea is to show only the 5 first entries and then, when a user scroll, it shows the 5 more.
Now, I had a look on this : https://github.com/orizens/ngx-infinite-scroll but the array used for the view only take strings.
I had a look at an example : Plunker Example of ngx-infinite-scroll and what cause the problem is this :
addItems(startIndex, endIndex, _method) {
for (let i = 0; i < this.sum; ++i) {
this.array[_method]([i, ' ', this.generateWord()].join(''));
}
}
Where this.generateWord() only generate random strings and _method is push or unshift.
How could I push or concat parts of an object into this so I can still make it work with my *ngFor inside my html template ?
Any idea of a plugin that accept http request object or how to make ngx-infinite-scroll work ?
Thanks
Ok, I didn't follow "best practices" for the code layout and don't show how to actually get data from a server to populate it ... but I did answer the basic question of how to use an object instead of a string to display.
The result is here: https://stackblitz.com/edit/angular-a5ew8f
I just replaced the hard-coded string with entries from a hard-coded array:
addItems(startIndex, endIndex, _method) {
let movieIndex=0
for (let i = 0; i < this.sum; ++i) {
movieIndex++;
if (movieIndex >= this.movies.length) movieIndex=0;
this.array[_method](this.movies[movieIndex]);
}
}
In a real application, you would want to go to the server to get 'n' (this.sum) more items each time the addItems method is called.
I am trying to add a <span> to my view when my session variable is not null.
The value of Session["error"] has the right value (I checked), but there is no <span> coming in my view when it is filled while the code DOES come into the IF statement.
#if (Session["error"] != null) { Html.Raw("<span class=\"alert\"> #Session[\"error\"].ToString() <span>"); }
Plz tell me what i need to change. I am a student and new to coding.
You need to add # to write the output of the function to the response stream. In short; #Html.Raw().
However, this is not how Razor code should be used. Instead you can embed HTML directly within your if, like so:
#if (Session["error"] != null)
{
<span class="alert">#Session["error"]</span>
}
Hi I am generating table from a 2-Dimensional array in perl.
But the output of my program is different if viewed in browser and viewing page source using developers tool in chrome:
Let me explain-
I have a subroutine to print the table from #RESULT array, the code is below
sub printTableFormattedEmpty {
my #array= #_ ;
print "<table border='0' cellspacing='0' bgcolor='#cfcfcf' cellpadding='0'>\n";
for(my $row_i = 0; $row_i < #array; $row_i++) {
print "<tr style='background-color:#B39DB3;'>\n";
for(my $column_i = 0; $column_i < #{ $array[$row_i] }; $column_i++) {
my $th = ($row_i == 0) ? "th" : "td";
print "</$th>";
print "$array[$row_i][$column_i]";
my $close = ($row_i == 0) ? 'th' : 'td';
print "</$close> \n";
}
print "</tr> \n";
}
print "</table> \n";
}
and i am calling the subroutine as
{
print "Table starts here!\n";
#$RESULT[0]- is array of many elements. u can see in output image
$RESULT[1][0]= 'No Active bookings available for you !';
$RESULT[2][0]= 'Click here to create new Booking !';
&printTableFormattedEmpty(#RESULT);
}
Now here i am not getting the expected output in a table , i am getting different output as shown in 2 figure:
when i inspect element and inspect the table i get:
But when i view page source of the page iam getting output formatted as table as shown in the fig:
I am really confused with this two types of Output, the both images are of the same page without refreshing.
How is this possible!
Did i do any mistake in my program or its something else.
Please Help me with This.
This is a typo!
There is a slash / in your opening HTML tag output.
for(my $column_i = 0; $column_i < #{ $array[$row_i] }; $column_i++) {
my $th = ($row_i == 0) ? "th" : "td";
# V HERE
print "</$th>";
print "$array[$row_i][$column_i]";
my $close = ($row_i == 0) ? 'th' : 'td';
print "</$close> \n";
}
Remove that slash and it will be fine.
As to why your two outputs are different: The HTML inspector shows the DOM structure after it has been parsed by the browser. It does not include invalid elements. Since stray closing elements are not valid, it's likely the parser just omitted them, so they are gone.
Viewing the source code on the other hand shows the real, unparsed code, which contains the wrong markup with the faulty HTML tags included. That is also where I saw the extra slashes. (read: your variable names are badly chosen. You would have seen it yourself had it been something like $open_tag and $closing_tag).
I have code like this in my razor index view:
#for (decimal hour=7m; hour<=20.5m; hour +=0.5m)
{
var item = #Model.Items.FirstOrDefault( i=> i.Hour == hour);
if (item != null)
{
<td colspan="#item.TimeBlocks">
#item.Description
</td>
hour += (item.TimeBlocks-1)* 0.5m;
}
else
{
<td>
+
</td>
}
}
For some reason, the VS2013 consistently tells me "} expected" in the Error List window. The syntax highlighter shows everything highlighted fine until the curly brace right before the else.
I have tried using #: for the html tags. It works fine in the if block, but in the else block I get the following error:
":" is not valid at the start of a code block.
I have tried wrapping the html tags in a tag as well, but that doesn't work either.
How would I do this to get it to render?
You have a mistake in your code.
The following line
var item = #Model.Items.FirstOrDefault( i=> i.Hour == hour);
Should actually read:
var item = Model.Items.FirstOrDefault( i=> i.Hour == hour);
Removing that will fix your code