This media is not supported in your browser
VIEW IN TELEGRAM
📄 @Attribute Decorator in Angular
#angular #decorator #attribute
As you can see, when we trigger the change detection by emitting the click event, Angular is checking the value.
We can be more efficient in this case if we use the @Attribute decorator. With this change, Angular will evaluate it once and forget about it. As a general rule, I prefer the @Attribute() approach when the string is a fixed value that never changes.
#angular #decorator #attribute
As you can see, when we trigger the change detection by emitting the click event, Angular is checking the value.
We can be more efficient in this case if we use the @Attribute decorator. With this change, Angular will evaluate it once and forget about it. As a general rule, I prefer the @Attribute() approach when the string is a fixed value that never changes.
import { Component, Attribute } from '@angular/core';
@Component({...})
export class ButtonComponent {
constructor(
@Attribute('type')
public type: ButtonType = 'primary'
) {
}
}
✅ Article Link: https://netbasal.com/getting-to-know-the-attribute-decorator-in-angular-4f7c9fb61243👍1
🧪 Attribute Injection in Angular: The HostAttributeToken Approach
#angular #decorator #attribute
🚩 > Angular 17.3
✅ Article link
#angular #decorator #attribute
Angular offers the @ Attribute decorator, facilitating the injection of attributes from the host node. It proves particularly handy when there’s no necessity to establish a binding.
🚩 > Angular 17.3
✅ Article link
👍1
📄 Angular HostAttributeToken: the new way to inject attributes
#angular #attribute #HostAttributeToken
✅ Article link
#angular #attribute #HostAttributeToken
By creating an input, you are instructing Angular to create a binding to that property and check it during each change detection cycle. That is really excessive, you only need that property to be checked once during component initialization. 🤯 To make this more performant you can instead inject the host-element attribute in the constructor thanks to the Attribute decorator
Since the release of Angular 14 there is now a cleaner approach to inject providers without using the constructor class: the inject() function. Up until now, this inject() function allowed to inject easily components, directives and pipes, but it was missing a method to inject host attributes. And that’s precisely why the HostAttributeToken class was introduced
✅ Article link
🤓 Replacing Static Inputs with the Host Attribute Token
#angular #decorator #Attribute #HostAttributeToken
🚩 > Angular 17
✅ Article link
#angular #decorator #Attribute #HostAttributeToken
🚩 > Angular 17
✅ Article link
👍1