ビューモデルオブジェクトのプロパティにバインドする方法は？

Question

多くのレベルのネストされたプロパティを持つ複雑なオブジェクトを持つフォームベースのアプリケーションを構築しています。

これまでのところ、私はsimple experiment with a single view model with one objectを作成しました。実験には、オブジェクトのプロパティにバインドされたフィールドがあり、データを正常に表示できます。ただし、フィールドを変更すると、オブジェクトは更新されていないように見えます。

フォーム入力がテンプレート全体に伝播するようにするにはどうすればよいですか？

あなたは以下のようにapp.jsにgetterメソッドを使用する必要が

Answer 1

、あなたのHTMLでは

get swaggerString() { 
    console.log(this.swagger); 
    const swaggerStringified = JSON.stringify(this.swagger); 

    return swaggerStringified; 
    } 

、プロパティへの変更方法、

${swaggerString} 

あなたのGISTを更新し、

https://gist.github.com/anonymous/3b85820d66c2dfbf0f770208a7c8b63f

希望します。

Answer 2

実際のアプリで何をする予定ですか？

受け入れられた回答は、要点に投稿された問題の解決方法にのみ回答します。あなたの本当のアプリがJSONデータを表示する必要はないと思っています。

深くネストされたオブジェクトのプロパティを表示したい場合は、単純ですが、単純にそれらのプロパティ自体にバインドするだけです。ここを参照してください：https://gist.run/?id=5af5c22be4b49c0e3fef327e3d8b986b

<pre> 
{ 
    "name": "${swagger.name}", 
    "version": "${swagger.version}" 
} 
</pre> 

あなたも、例えば、深いオブジェクトツリーの中で任意に行くことができます${foo.bar.baz.ball.foop}。

オレリアは、あなたが観察するためにそれを言うことが何であれ、変化を観察することです。オブジェクトであるプロパティを単に観察するように指示すると、プロパティ自体の変更を監視することしかできません。つまり、プロパティに異なるオブジェクトを割り当てた場合にのみ変更が表示されます。パフォーマンス上の理由から（また、Object.observeがキャンセルされたため）、オブジェクトのすべてのプロパティを変更する必要はありません。

すべての希望は失われません。いくつかの具体的な点で回答してください。私はあなたを助けようとします。