angulaire 2, valider la forme si au moins une entrée est tapée

Question

Je suis assez nouveau à Angular, et j'ai déjà cherché sur le web, sans trouver une solution correcte à ma situation.

J'ai un formulaire dynamique créé par un * ngFor. J'ai besoin de désactiver le bouton de soumission si les entrées sont toutes vides et affichent la div d'alerte; mais je dois activer le soumettre si au moins une de ces formes contient quelque chose de différent de ''.

Voici mon code html

<form class="form-inline" #form="ngForm"> 
    <div class="form-group" *ngFor="let meta of state.metaById; let i = index" style="margin: 5px"> 
     <label>{{meta.nome}}</label> 
     <input type="text" class="form-control" #nome (blur)="inputInArray(nome.value, i);"> 
    </div> 
    <button type="button" class="btn btn-primary" (click)="getCustomUnitaDocumentaliRow(this.param)" [disabled]="fieldNotCompiled">invia</button> 
</form> 
<div class="alert-notification" [hidden]="!fieldNotCompiled"> 
    <div class="alert alert-danger"> 
     <strong>Va compilato almeno un campo.</strong> 
    </div> 
</div> 

et voici mon code dactylographiée

inputInArray(nome: string, indice) { 
if (this.state.controlloMetaId = true) { 
    this.state.metadatoForm[indice] = nome; 
} 
// this.fieldNotCompiled = false; 
for (const i in this.state.metaById) { 
    console.log(this.state.metadatoForm); 
    if (isUndefined(this.state.metadatoForm[i]) || this.state.metadatoForm[i] === '') { 
    this.fieldNotCompiled = true && this.fieldNotCompiled; 
    } else { 
    this.fieldNotCompiled = false && this.fieldNotCompiled; 
    } 
    console.log(this.fieldNotCompiled); 
} 

Avec ce code, je peux vérifier la première fois quelque chose du type d'utilisateur dans une entrée, mais échoue s'il vide l'un d'entre eux (ou tous les)

Merci pour votre temps

Answer 1

MISE À JOUR

Vérifiez si une entrée a un changement qui est différent de vide ou de l'espace, tout en faisant:

<input ... #nome (input)="fieldNotCompiled = !nome.value.trim()" ....> 

DEMO

---

Vous pouvez définir un écouteur à la forme changements:

@ViewChild('form') myForm: NgForm; 
.... 
ngOnInit() { 
    this.myForm.valueChanges.subscribe((value: any) => { 
     console.log("One of the inputs has changed"); 
    }); 
}