[解決済み】KnockoutJSのテンプレートバインディングエラーをデバッグする方法は？

質問

KnockoutJSのテンプレートでデバッグの問題が発生し、困っています。

例えば、"というプロパティにバインドしたいとします。 items しかし、テンプレートの中でタイプミスをしてしまい、（存在しない）プロパティ ".にバインドしてしまいました。 item となります。

Chromeのデバッガーを使っても教えてくれるだけです。

"item" is not defined.

バインディング問題についてより多くの情報を得るのに役立つツール、テクニック、コーディングスタイルがありますか？

どのように解決するのですか？

あるスコープで利用可能なデータに問題がある場合、私がよく行うことのひとつは、テンプレート/セクションを次のようなものに置き換えることです。

<div data-bind="text: ko.toJSON($data)"></div>

あるいは、もう少し読みやすいバージョンが欲しい場合。

<pre data-bind="text: JSON.stringify(ko.toJS($data), null, 2)"></pre>

これは、そのスコープでバインドされているデータを吐き出し、適切にネストされていることを確認するためのものです。

アップデート：KO 2.1時点 というように簡略化することができます。

<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>

ここで、引数は JSON.stringify .