Can someone help me with adding an asterisk to the required fields using a directive? I currently have this code:
.required label::after {
content: '*';
color: red;
}
It works well in my HTML:
<div class="required" >
<label for="entity"> entity </label>
<div>
<select id="entity">
<option value="">Entity</option>
</select>
</div>
</div>
However, I am attempting to implement this functionality in a directive. Here is what I have so far:
@Directive({
selector: '[lambRequired]',
host: {
'[style.after.content]': '"*"',
'[style.after.color]': '"red"',
},
})
export class RequiredDirective {
constructor() {
}
}
When I try to use the directive in my HTML like this, it doesn't work:
<div >
<label lambRequired for="entity"> entity </label>
<div>
<select id="entity">
<option value="">Entity</option>
</select>
</div>
</div>
If anyone could provide assistance or guidance on how to make this directive work, I would greatly appreciate it. Thank you.