@Attribute() декоратор

В Angular есть @Attribute() декоратор, который позволяет получить константное значение атрибута, доступное на элементе хоста компонента или директивы. Используется с параметром конструктора для значений которые не меняются в процессе работы.

@Component({
  selector: 'my-comp',
  template: `Type: {{myVar}}`,
})
export class MyComponent {
  constructor(@Attribute('type') public myVar: string) {
    console.log('Attributre =', myVar);
  }
}

Особенности:

  • Любые значения предоставляются в виде строки @Attribute(<---->) type: string
  • Значения являются статическими и не обновляются, как @Input
  • Не может использоваться [attribute] синтаксис привязки
  • Линтер codelyzer считает использование Attribute плохой практикой. (Лично я не понимаю почему)

Несмотря на ограничения использования, декортор может принести преимущество в плане эффективности, поскольку свойства не привязываются и их не нужно проверять во время цикла обнаружения изменений.


Похожие записи

Как добавить ng-bootstrap компоненты в проект Angular-CLI?

Покажу на примере нового проекта.

ng new project_name
cd project_name
npm install --save bootstrap@next
npm install --save @ng-bootstrap/ng-bootstrap

В angular-cli.json в секцию style надо добавить наш CSS, чтобы глобально подключить стили.

  "styles": [
    "styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.min.css"
  ],
17 августа 2017 г. в Angular

Angular attribute setter

Пример задания значения булева Input свойства как директивы, на примере:

09 октября 2018 г. в Angular

Angular. Когда не надо отписываться в RxJS?

В async pipe за вас отпишется Angular. Во всех остальных случаях лучше отписываться самостоятельно. Допускается не отписываться в потоках, где будет гарантировано вызван complete.

Angular. Manually retry http request

На память. Некоторое время назад я решил достаточно необычную задачу, но в последствии на backend`е переделали логику и код был удалён из проекта.