Angular2 - How to use one way databinding to bind to JSON attribute - json

Question

I try to use Angular2's one way databinding to bind an input field value to a JSON property.
The JSON object looks like this:
[
{
"name": "my name",
"list": [
{
"date": "0101970",
"list": [
{
"timespan": "6-7",
"entries": [
{
"name": ""
},
{
"name": ""
},
{
"name": ""
}
]
}
]
}
]
}
]
I want to bind the value to a specific name attribute of entries.
This is how I try to do the on way binding:
<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>
This is my Component:
export class InputComponent {
public categories:Category[];
constructor(private _dataService:DataService) {
// ... fetch data from the service here
}
}
As I understand the databinding in Angular2 (ngModel)="attribute" binds from the view to the model and [ngModel]="attribute" binds the other way around.
So, what is wrong with my <input type="text" class="form-control" (ngModel)="entry.name"> then?
I could use two way databinding instead of course, but I have some other constraints (disabling form elements) which just apply after a button was pressed and not on the user input.

Answer 1

With
<input type="text" class="form-control" [ngModel]="entry.name">
you bind the JSON value to the input.
(ngModelChange)="model=$event" updates the model when an `ngModelChange` event is emitted.
[(ngModel)]="model" binds two-way
where ngModel is a directive with an
#Input() ngModel; // for the [ngModel]="..." bindign
#Output() ngModelChange = EventEmitter(); // for the (ngModelChange)="..." binding
together they support the shorthand form
[(ngModel)]="model"