/ / Angular2 - Comment utiliser la liaison de données à sens unique pour se lier à un attribut JSON - json, angulaire, liaison de données d'objet à 2 voies

Angular2 - Comment utiliser une liaison de données unidirectionnelle pour lier un attribut JSON - json, liaison angulaire, objet-databinding

J'essaie d'utiliser la liaison de données à sens unique d'Angular2 pour lier une valeur de champ d'entrée à une propriété JSON.
L'objet JSON ressemble à ceci:

[
{
"name": "my name",
"list": [
{
"date": "0101970",
"list": [
{
"timespan": "6-7",
"entries": [
{
"name": ""
},
{
"name": ""
},
{
"name": ""
}
]
}
]
}
]
}
]

Je veux lier la valeur à un spécifique name attribut de entries.
C'est comme ça que j'essaye de faire la reliure on way:

<div class="col-md-4" *ngFor="#category of categories">
<div>
<div class="col-md-12">
<h1>{{category.name}}</h1>
</div>
</div>
<div *ngFor="#listentry of category.list">
<div class="row">
<div class="col-md-12">
<h2>{{listentry.date}}</h2>
</div>
</div>

<div class="row" *ngFor="#shift of listentry.list">
<div class="row">
{{shift.timespan}}
</div>
<div class="row" *ngFor="#entry of shift.entries">
<div class="col-md-10">
<input type="text" class="form-control" (ngModel)="entry.name">
</div>
</div>
</div>
</div>
</div>

Ceci est mon composant:

export class InputComponent {

public categories:Category[];

constructor(private _dataService:DataService) {
// ... fetch data from the service here
}
}

Si je comprends bien la liaison de données dans Angular2 (ngModel)="attribute" lie de la vue au modèle et [ngModel]="attribute" lie l'inverse.
Alors, quel est le problème avec mon <input type="text" class="form-control" (ngModel)="entry.name"> puis?

Je pourrais utiliser une liaison de données bidirectionnelle au lieu bien sûr, mais j'ai d'autres contraintes (désactivation des éléments de formulaire) qui s'appliquent uniquement après la pression d'un bouton et non sur la saisie de l'utilisateur.

Réponses:

0 pour la réponse № 1

Avec

<input type="text" class="form-control" [ngModel]="entry.name">

vous liez la valeur JSON à l'entrée.

(ngModelChange)="model=$event" updates the model when an `ngModelChange` event is emitted.
[(ngModel)]="model" binds two-way

ngModel est une directive avec un

@Input() ngModel; // for the [ngModel]="..." bindign
@Output() ngModelChange = EventEmitter(); // for the (ngModelChange)="..." binding

ensemble, ils soutiennent la forme abrégée

[(ngModel)]="model"