web-dev-qa-db-ja.com

ノックアウトビューモデルプロパティ未定義

私は簡単なforeachを持っています:

<div id="customersArea" data-bind="foreach: people">
            <div class="section" data-bind="attr: { 'personid': PersonId }" >
                <div class="sectionActions">
                    <div><a class="action" href="#" data-bind='click: $parent.removePerson'>Remove</a></div>
                </div>
                <div class="sectionText">
                    <span data-bind="if:LastName, text:LastName"></span>
                    <span data-bind="if:FirstName, text:FirstName"></span>
                    <span data-bind="if:MailingAddress">
                        <span data-bind="with:MailingAddress">
                            <span data-bind="text:StreetPartOne"> </span>
                            <span data-bind="text:StreetPartTwo">  </span>
                            <span data-bind="text:City"></span>
                            <span data-bind="text:PostalCode"></span>
                        </span>
                    </span>

                    <span data-bind="if:EmailAddress, text:EmailAddress"></span>
                    <span data-bind="if:MainPhoneNumber, text:MainPhoneNumber"></span>
                    <span data-bind="if:MobilePhoneNumber, text:MobilePhoneNumber"></span>

                </div>

                <div class="sectionOptions">

                </div>
            </div>
        </div>

モデル{PersonId:33}にバインドできるようにしようとしていますが、残りが見つからない場合はレンダリングされません。これや他の方法で試してみると

Uncaught Error: Unable to parse bindings.
Message: ReferenceError: MailingAddress is not defined;
Bindings value: if:MailingAddress

テストする簡単なjsfiddleを作成しました。

http://jsfiddle.net/E7kUr/

30
maxfridbe

そのため、いくつかのオプションがあります。

  1. KOは、オブジェクトから離れていない限り、未定義のプロパティに対してバインドしようとすると問題が発生します。そのため、さまざまなバインディングの前に$data.を付けることができ、KOはバインディングを解析できます。サンプル: http://jsfiddle.net/rniemeyer/dLCL8/ 複数のプロパティが常に一緒になることがわかっている場合は、withまたはifを使用できます。これらのオプションに関するステートメント。

  2. 「未定義」プロパティの処理に関する別の考え方は、これらのプロパティが欠落している場合にこれらのプロパティを設定するバインディングを作成することです。 this answerを見てください。それは似ていますが、潜在的に「テキスト」バインディングを使用します。サンプル: http://jsfiddle.net/rniemeyer/dLCL8/4/

73
RP Niemeyer

使用 $dataプレフィックス、KOはそれを解析できます

サンプル: http://jsfiddle.net/baryon/NsuL7/1/

7
Baryon Lee