Bouton de désactivation dans l'angle 2 avec deux conditions
Est-ce possible dans angular 2?
<button type="submit" [disabled]="!validate && !SAForm.valid">Add</button>
J'espère que si les deux conditions sont vraies, elles activeront le bouton.
J'ai déjà essayé le code ci-dessus mais il ne fonctionne pas comme prévu.
Il semble que vous ayez besoin d’un OR à la place:
<button type="submit" [disabled]="!validate || !SAForm.valid">Add</button>
Cela désactivera le bouton s'il n'est pas validé ou si SAForm.valid.
Déclarer une variable dans composant.ts et l'initialiser à une valeur
buttonDisabled: boolean;
ngOnInit() {
this.buttonDisabled = false;
}
Maintenant en .html ou dans le template, vous pouvez mettre le code suivant:
<button disabled="{{buttonDisabled}}"> Click Me </button>
Vous pouvez maintenant activer/désactiver le bouton en modifiant la valeur de la variable buttonDisabled.
En plus de l’autre réponse, je voudrais souligner que ce raisonnement est également connu sous le nom de the loi de De Morgan. En réalité, il s’agit plus de mathématiques que de programmation, mais il est tellement fondamental que tous les programmeurs devraient le savoir.
Votre problème a commencé comme ça:
enabled = A and B
disabled = not ( A and B )
Jusqu'ici tout va bien, mais vous êtes allés plus loin et avez essayé de retirer les accolades… .. Et c'est un peu compliqué, car vous devez remplacer la and/&& par une or/||.
not ( A and B ) = not(A) OR not(B)
Ou dans une notation plus mathématique:
Je garde toujours cette loi à l'esprit chaque fois que je simplifie des conditions ou que je travaille avec des biens.