Comment [(ngModel)] fonctionne avec le flux de données unidirectionnel dans Angular 2

Question

Angular 2 prend en charge le flux de données unidirectionnel, une par une. Comment fonctionne la liaison de données bidirectionnelle [(ngModel)] dans Angular2?

Answer 1

Angular2 comprend [(ngModel)] = myName comme property + event de liaison et comme une version affaissée de,

1. [ngModel] = 'myName' et
2. (ngModelChange) = 'updateMyNameValue(myName)'

Leur politique unidirectional data flow pourrait tout aussi bien que prendre la version élargie de celui-ci tels que la définition de la variable de portée explicitement par l'événement inputs lorsque la valeur est modifiée et vice-versa, de sorte que ce syntact ic version sucre il pourrait ressembler presque comme

myName = ''; 
function updateMyNameValue(elem) { 
    // find scope variable of `myName` and update it 
    // find element in view and update it 
} 
// <input type="text" onchange="updateMyNameValue(this)" value="" /> 

Selon le docs,

[(ngModel)] est un exemple spécifique d'un modèle plus général dans lequel angulaire « de sucres » la syntaxe [(x)] dans une propriété d'entrée x pour la liaison de propriété et une propriété de sortie xChange pour la liaison d'événements. Angular construit l'instruction de modèle de liaison de la propriété d'événement par en ajoutant =$event à la chaîne littérale de l'expression de modèle.

[(x)]="e" <==> [x]="e" (xChange)="e=$event"