Obtenir la valeur du champ de texte d'entrée dans angular 5
cela semble être une question facile, mais rien de ce que j'ai trouvé n'a fonctionné pour moi. J'ai un champ de saisie standard dans mon component.html:
<div class="form-group">
<label>Serial</label>
<input type="text" name="serial" id="serial" [ngModel]="serial" [value]="serial" class="form-control">
</div>
Ainsi, lorsque l'utilisateur soumet maintenant le formulaire, comment puis-je obtenir la valeur qu'il a saisie dans le champ? Si je fais une simple fonction console.log(this.serial) dans ma fonction onSubmit(), je ne reçois rien. J'ai déclaré serial: String; Dans mon composant.ts
Vous avez mal lié. Vous avez besoin de banana-in-box binding [(ngModel)]="serial" au lieu de [ngModel]="serial"
() Dans la liaison mettra à jour le modèle serial à chaque fois que l'entrée sera modifiée. De input à model
Le simple [] Liera simplement les données de serial s'il est modifié manuellement par le code. Cela entraînera nidirectionnel liaison - de model à input.
Comme vous le devinez - ensemble [()] ils rendront bidirectionnel contraignant.
c'est un moyen contraignant. de la vue au contrôleur.
fichier code.component.html
<label >Code</label>
<input (input)="tcode=$event.target.value" type="text" class="form-control">
<button class="btn btn-success" (click)="submit()">Submit</button>
fichier code.component.ts
tcode : string;
submit() {
console.log("the code :" + this.tcode);
}