Какова альтернатива ng-init="myText='Hello World!'"
в Angular 2 для добавления в шаблон, а не в компонент
<div ng-app="" ng-init="myText='Hello World!'">
альтернатива в Angular 2
Какова альтернатива ng-init="myText='Hello World!'"
в Angular 2 для добавления в шаблон, а не в компонент
<div ng-app="" ng-init="myText='Hello World!'">
альтернатива в Angular 2
Вы можете использовать директиву
@Directive({
selector: 'ngInit',
exportAs: 'ngInit'
})
export class NgInit {
@Input() values: any = {};
@Input() ngInit;
ngOnInit() {
if(this.ngInit) { this.ngInit(); }
}
}
вы можете использовать его для передачи функции, называемой как
<div [ngInit]="doSomething"
или для получения доступных значений
<div ngInit [values]="{a: 'a', b: 'b'}" #ngInit="ngInit">
<button (click)="clickHandler(ngInit.values.a)">click me</button>
</div>
ngInit
добавляет директиву[values]="{a: 'a', b: 'b'}"
устанавливает некоторые начальные значения#ngInit="ngInit"
создает ссылку для последующего использованияngInit.values.a
считывает значение a
из созданной ссылки.См. также Преобразование Angular 1 в Angular 2 ngInit function
Возможно, используя OnInit цикл жизненного цикла, как показано ниже,
Импортировать OnInit из основной библиотеки
import {Component, OnInit} from '@angular/core'
Внедрите его в класс компонентов
export class App implements OnInit {
}
Внедрить метод ngOnInit
ngOnInit(){
this.myText='Hello World!'
}
Хотя я согласен с тем, что инициализация должна идти в цикл жизненного цикла ngOnInit, следует также отметить, что вы можете использовать конструктор компонента для инициализации членов класса. В вашем простом примере вы можете даже использовать объявление члена для установки переменной, например:
@Component({ template: '<div>{{myText}}</div>' })
export class MyComponent {
myText = 'Hello World!';
}
Маленькое обновление! В последних версиях Angular это не сработает:
@Directive({
selector: 'ngInit',
exportAs: 'ngInit'
})
вы должны использовать '[]':
@Directive({
selector: '[ngInit]',
exportAs: 'ngInit'
})