Menu
I want to set href attribute of element depend on content of element from interpolation.
<div>
<ul class="contactnav">
<li *ngFor="let contactItem of contactItems" >
<a class="{{ contactItem.iconBootStrap }}" href=" {{ contactItem.contactForm.indexOf('@') }} !== -1? 'mailto:{{ contactItem.contactForm }}' : '#'" data-rel="external">
{{ contactItem.contactForm }}
</a>
</li>
</ul>
</div>
How should I define condition in element to set href for value if contactItem.contactForm includes @ otherwise set for value '#'?
527
This can be done by adding disabled attribute to the nominee name input box when add nominee checkbox is checked. Angular provides support to add an attribute to an HTML element conditionally using the ternary operator.
It would actually need to be "attr. spellcheck" : "true" , and it's just the alternative syntax to @HostBinding() . Everything you can do with Angular decorators, @Input() , @Output() , @ViewChild() , @HostListener() , ..., can be done with host: as well.
We simply use attribute binding to add and set a value for a data attribute. According to Angular docs: Attribute binding syntax resembles property binding. Instead of an element property between brackets, start with the prefix attr, followed by a dot (.)
Attribute binding syntax is like property binding. In property binding, we only specify the element between brackets. But in the case of attribute binding, it starts with the prefix attar, followed by a dot (.), and the name of the attribute.
What you ask for is setting a property, not an attribute.
You can use
[href]="contactItem.contactForm.indexOf('@') !== -1 ? 'mailto: ' + contactItem.contactForm : '#'"
For conditional attribute binding see How to add conditional attribute in Angular 2?
81
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
