Angular2の一方向データバインディングを使用して、入力フィールド値をJSONプロパティにバインドしようとしています。Angular2 - JSON属性にバインドする一方向のデータバインディングを使用する方法
[
{
"name": "my name",
"list": [
{
"date": "0101970",
"list": [
{
"timespan": "6-7",
"entries": [
{
"name": ""
},
{
"name": ""
},
{
"name": ""
}
]
}
]
}
]
}
]
私はentries
の特定name
属性に値をバインドしたい:
JSONオブジェクトは、次のようになります。
これは私が途中で結合やろうかです:
<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>
これは私のコンポーネントである:
export class InputComponent {
public categories:Category[];
constructor(private _dataService:DataService) {
// ... fetch data from the service here
}
}
私はAngular2 (ngModel)="attribute"
でデータバインディングは、ビューからモデルに結合し、[ngModel]="attribute"
理解したように他の方法でバインドします。
だから私の<input type="text" class="form-control" (ngModel)="entry.name">
の何が間違っていますか?
私はコースの代わりに2ウェイのデータバインディングを使用できますが、ボタンを押した後で、ユーザー入力ではなく適用するいくつかの他の制約(フォーム要素を無効にする)があります。
感謝をサポートしていますが、 '(ngModelChange)を追加し、一緒
とディレクティブです
input要素へのmodel = $ event "'は機能しません。また、エラーメッセージもありません。前述のように、他の制約のために '[(ngModel)] =" model "を使うことはできません。入力をモデルにバインドしたいだけです。モデルが変更された場合、私はビューを更新しません。 – Allipon
'ngModel'を使用したくない場合や使用できない場合は、' 'のように入力要素自体のイベントをリッスンする必要があります(ngModel) ''(ngModel) 'のように入力が' ngModel'イベントだけで何もしません。これは '[xxx] =" model "と'(xxxChange)= "model = $ event" 'を([xxx)] =" model "と組み合わせることができる特殊な形式なので動作します –
ありがとう! ngModelは仕事をすることができます...私は今(変更)を使用します。 – Allipon