Я новичок в Angular 2. Каковы соответствующие события от AngularJS до Angular 2?
например: ng-click to (щелкните)
Как насчет ng-init и всех других событий? У меня нет intellisense в VS.NET, поэтому трудно догадаться.
Любая помощь, пожалуйста!
Спасибо
События, обработанные по умолчанию, должны отображаться из исходных событий компонента HTML DOM:
http://www.w3schools.com/jsref/dom_obj_event.asp
просто удалив префикс on.
onclick --- > (click)
onkeypress --- > (keypress)
и т.д...
Вы также можете создавать свои пользовательские события.
Однако ngInit не является событием HTML, это часть жизненного цикла компонента Angular, а в Angular 2 они обрабатываются с использованием "крючков", которые являются в основном конкретными именами методов внутри вашего компонента, которые будут когда компонент входит в конкретный цикл. Как:
и т.д...
Это одно из больших преимуществ Angular2. Не каждому событию требуется настраиваемая директива ng-xxx.
С пользовательскими элементами и всеми другими библиотеками, производящими всевозможные пользовательские события, этот подход не летает.
В Angular2 синтаксис (eventName)="expression" привязки позволяет подписаться на любое известное и неизвестное событие.
Изменена переменная $event (eventName)="myEventHandler($event)"
См. также https://angular.io/docs/ts/latest/guide/template-syntax.html#!#event-binding
Вы можете использовать следующий синтаксис для обработки событий (например, click как ng-click с помощью Angular1):
<button (click)="callSomeMethodOfTheComponent()">Click</button>
Разница здесь в том, что это более общий. Я имею в виду, что вы можете напрямую использовать события DOM, но также и пользовательские, определенные с помощью класса EventEmitter.
Вот пример, описывающий, как обрабатывать событие click и настраиваемое событие (my-event), инициированное субкомпонентом:
@Component({
selector: 'my-selector',
template: `
<div>
<button (click)="callSomeMethodOfTheComponent()">Click</button>
<sub-component (my-event)="callSomeMethodOfTheComponent()"></sub-component>
</div>
`,
directives: [SubComponent]
})
export class MyComponent {
callSomeMethodOfTheComponent() {
console.log('callSomeMethodOfTheComponent called');
}
}
@Component({
selector: 'sub-component',
template: `
<div>
<button (click)="myEvent.emit()">Click (from sub component)</button>
</div>
`
})
export class SubComponent {
@Output()
myEvent: EventEmitter;
constructor() {
this.myEvent = new EventEmitter();
}
}
Надеюсь, это поможет вам, Thierry
Отличное место, чтобы начать понимать Angular 2 - официальная веб-страница.
Здесь вы можете увидеть все angular2/common ng-XXX, хотя теперь это выглядит следующим образом ngXxxx
В моем случае лучший способ понять различия между Angular 1 и Angular 2 выполнял следующие уроки: