Readdy Write  
0,00 €
Your View Money
Views: Count
Self 20% 0
Your Content 60% 0

Users by Links 0
u1*(Content+Views) 10% 0
Follow-Follower 0
s2*(Income) 5% 0

Count
Followers 0
Login Register as User

Angular event in EingabeFeld

22.12.2020 (👁202)

Angular event in Eingabe

 

 

Angular Events erstellt man, indem man in der html Seite den Event in das Input Feld einfügt wie hier mit

(input)="onChangeInput($event)" 

 

und in der Code-Behind Seite den Event empfängt

  onChangeInput(eventany){

      console.log(event);

      //this.ListName=event.target.value;

  }

 

 

 

Hinweis: beim Input Feld gibt es nur den Angular (input) und nicht das javascript oninput oder onclick

 

 

.html Seite

Einfügen des (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 der Code-Behind Seite

 

 

Code in der Datei  src\app\components\liste\liste.component.ts

 

import { ComponentOnInit } from '@angular/core';

@Component({

  selector: 'app-liste',

  templateUrl: './liste.component.html',

  styleUrls: ['./liste.component.css']

})

export class ListeComponent implements OnInit {

  

  //< Angular Data >

  ListNamestring = "Data Excample";

  //</ Angular Data >

  constructor() { }

  ngOnInit(): void {

  }

  onChangeInput(eventany){

      console.log(event);

      //this.ListName=event.target.value;

  }

}