forme angulaire 2 marque invalide

Question

J'ai le code exemple suivant:

component.html

<form onsubmit="" #VoucherForm="ngForm"> 
    <input type="text" name="field1" [(ngModel)]="rule['condition']" 
    (ngModelChange)="validateJMES($event)">  
<form> 

component.ts

validateJMES(value){ 
    try { 
    this.jmespath.search({ }, value); 
    } catch (e) { 
    // Code that makes Form invalid 
    } 
} 

Alors basiquement i vérifier si l'entrée sur le champ de texte est une expression json valide. Si j'attrape une erreur je voudrais rendre le formulaire invalide.

Existe-t-il un moyen de le faire?

Answer 1

Oui, vous pouvez l'obtenir, mais c'est beaucoup d'efforts dans Template driven que ce que vous utilisez ici.

juste un aperçu de la façon dont vous pouvez y parvenir.

Obtenez une référence de modèle du formulaire en utilisant viewchild. Obtenez le formulaire Contrôle de l'entrée à partir du ngForm et puis définissez le setErrors. LINK.

Une chose comme ça mais c'est juste pour l'entrée que vous pouvez faire pour l'ensemble de la forme.

<input #model="ngModel" [ngModel]="value"> 
<button (click)="model.control.setErrors({})">Invalidate</button>