I tried to set CSS based on a condition. but inside quotes. I get a syntax error. Can any one help me out to find the solution?
<div>
<span ng-class='{\' rdng-error-rate\ ': test}'>#=sum#</span>
</div>
This is my actual code:
{
field: "errorRate",
title: "ERROR RATE",
footerTemplate: "<div ng-class="{'rdng-error-rate': #=sum# }"> #=sum# </div>"
}
Why can't you use this way?
ng-class='{"rdng-error-rate": "test"}'
JSON object literals are meant to have " in their strings.
Try to use one of this & < > -
or do some changes in your actual code
{
field: "errorRate";
title: "ERROR RATE";
footerTemplate: "<div ng-class="{'rdng-error-rate': "#=sum#" }"> #=sum</div>";
}
Related
I wanted to use the Slice Pipe so a list will stop showing after 5 elements, so far so good only problem is I want to use a " , " to seperate them and after the 5th element I want to have this" ... " I tried various things like a custom pipe or the truncate Pipe but nothing helped me. Can someone maybe give me a pointer where my mistake lies?
<div class="farmer-common-products "
*ngFor="let commonCategory of farm.commonProductCategories | slice:0: 5 " >
{{ commonCategory.name }}
</div>
To solve your problem you can use local variables in your *ngFor (see docs). Like in the following example:
<div class="farmer-common-products "
*ngFor="let commonCategory of farm.commonProductCategories | slice:0: 5; let last = last">
{{ commonCategory.name }}
<span *ngIf="!laste">,</span>
<span *ngIf="last && farm.commonProductCategories.length">...</span>
</div>
Or you can implement a Pipe, which returns you a string in your desired format:
#Pipe({
name: 'formatCategories'
})
export class FormatCategoriesPipe implements PipeTransform {
transform(arr: any[]): string {
let text = arr.slice(0, 5).join(',');
if (arr.length > 5) {
text += '...';
}
return text;
}
}
Is there any way to get div's inner text except 'by '?
<div class="name">
"by "
<em>Some Author</em>
", "
<em>Another Author</em>
</div>
What's pretty strange about your HTML is the quotes and the whitespace between the "Some Author" <em> and the comma. I assume you mean this instead:
<div class="name">
by <em>Some Author</em>, <em>Another Author</em>
</div>
With XPath, you could fetch the nodes with a query like this:
//*[#class='name']/node()[position()>1]
If we're talking about a browser environment and you want a single string, not just a collection of nodes, you could do:
document.querySelector('div.name').textContent.replace(/^\s*by\s*/, '')
You can do it with Jquery like this... but it'll remove the "," too...
Check it out:
$(document).ready(function(){
var name = $('div').children('em');
$('div').html(name);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="name">
"by "
<em>Some Author</em>
", "
<em>Another Author</em>
</div>
You can try the expression:
//em/text()
Output:
'Some Author'
'Another Author'
You can try below XPath to get all descendant text nodes, except the first one:
(//div//text())[position() > 1]
I have a simple question (I hope this). I have a service that return a string as result. The format is something like this:
"
Test1: the association has been accepted.\nTest2: the association has been accepted.\n"
"
On the client side (I'm using Angular 1.5.x) I put that string into a object (say the variable $scope.alert.message). After that I want to print that string in a modal. My html is:
<script type="text/ng-template" id="infoTemplate.html">
<div class="modal-header left" ng-class="['div-' + alert.type, closeable ? 'alert-dismissible' : null]">
<h3 class="modal-title" id="modal-title">Info</h3>
</div>
<div class="modal-body" id="modal-body">
<img class="imm-info" ng-class="['imm-' + alert.type, closeable ? 'alert-dismissible' : null]" />
<p class="col-sm-10 col-sm-offset-2">{{alert.message}}</p><button class="col-sm-3 col-sm-offset-5 btn " ng-class="['button-' + alert.type, closeable ? 'alert-dismissible' : null]" ng-click="cancel()">OK</button>
</div>
</script>
You can see the '{{alert.message}}'. My problem is that my message "doesn't display" the character '\n'. So it doesn't create more than one line. An example here:
example
I use the white-space: pre-wrap CSS style, e.g. :
<p style="white-space: pre-wrap">{{alert.message}}</p>
Try this in HTML:
<pre>{{ alert.message }}</pre>
Already answered here:
The < pre > wrapper will print text with \n as text
\n is not interpreted in html. You need to replace these instances with <br/> elements. You could for example replace them with a regex if you do not want to change the original string.
You can write a function where you take the alert-message and split it by "\n"
than iterate trough it via *ngFor.
For example:
<p *ngFor="let msg of getMessageSplitted(alert.message)">{{msg}}</p>
Example:
<a title="A web design community.'test'~`!##$%^&*()-_+=\|][{};:,<.>?/ **"new test"** " href="http://css-tricks.com">CSS-Tricks</a>
In tooltip, after the double quotes "new test" is not working.
Is there any possible to show the content in tooltip like this
ex: testing 'welcome', # 3 $ ^ & * "flow"?
The problem is that your double quotes in the title close your title automatically. Escape them by replacing " with " and also funkwurm recommends to replace < and > with < and > respectively to avoid errors in xml:
<a title="A web design community.'test'~`!##$%^&*()-_+=\|][{};:,<.>?/ **"new test"** " href="http://css-tricks.com">CSS-Tricks</a>
You can use this is also.
<a title="Answer to your's question.'Test It' :):)'B Happy' :):)"new test"**" href="http://css-tricks.com">CSS-Tricks</a>
I am using this code to store HTML code in a variable called $conversions
$conversions = "GBP " . number_format($file*0.84) . "CHF " . number_format($file*1.23)
However I can't seem to figure out how to add a <br> before the word "CHF ".
Any ideas?
The whole code is as follows:
<?php
$file = get_field('fl_price');
if(trim($file) == ""){echo 'Price on Application' ;}else{$conversions = "GBP " . number_format($file*0.84) . "<br />CHF " . number_format($file*1.23) ;echo 'EUR ' . number_format($file) . "</br><a class=\"wp-tooltip\" title=\" $conversions \">Other Currencies</a>" ;}
?>
$conversions = "GBP " . number_format($file*0.84) . "
CHF " . number_format($file*1.23);
Echoing $conversions will now have a HTML-linebreak before CHF.
You are adding your string to an attribute of <a> called title. This isn't going to be displayed and is certainly not going to render any HTML (like a br tag).
edit:
As per OptimusCrime's suggestion, this does work:
http://jsfiddle.net/5rM4u/1/
Replace your <br/> with
and you're good to go.
You are trying to print the $conversions variable in the "title" of the "a" tag. just using <br /> will not work.
See some of the answers to this question "How can I use a carriage return in a HTML tooltip?" it may contain the answer that you are looking for.