Angular event in Eingabe
Angular
events are created byinserting the event in the input field in the html page as
here with
|
(input)="onChangeInput($event)"
|
and receives
the event in the code-behind page
|
onChangeInput(event: any){
console.log(event);
//this.ListName=event.target.value;
}
|
Note: for the
input field there is only the Angular (input) and not the javascript oninput or
onclick
.html page
Insert the (input)=”onInputEvent($event)“
Code src\app\components\liste\liste.component.html
|
<p>Eingabe ngModel 2Way:<br>
<input type="text" class="forms-control" [(ngModel)]="ListName" ></p>
Ausgabe={{ ListName }}
<p>Eingabe event Binding: <input type="text" class="forms-control"
(input)="onChangeInput($event)" ></p>
Ausgabe={{ ListName }}
|
In the
code-behind page
Code in the filesrc\app\components\liste\liste.component.ts
|
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-liste',
templateUrl: './liste.component.html',
styleUrls: ['./liste.component.css']
})
export class ListeComponent implements OnInit {
//< Angular Data >
ListName: string = "Data Excample";
//</ Angular Data >
constructor() { }
ngOnInit(): void {
}
onChangeInput(event: any){
console.log(event);
//this.ListName=event.target.value;
}
}
|