knockout viewmodel属性undefined

时间:2012-02-14 17:14:10

标签: knockout.js

我有一个简单的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/

2 个答案:

答案 0 :(得分:73)

所以,你有几个选择:

  1. 当您尝试绑定未定义的属性时,KO会出现问题,除非它们不在对象之外。因此,您可以使用$data.为各种绑定添加前缀,KO将能够解析您的绑定。示例:http://jsfiddle.net/rniemeyer/dLCL8/如果您知道多个属性将始终在一起,那么您可以围绕这些选项使用withif语句。

  2. 处理“未定义”属性的另一种方法是创建一个绑定,在缺少这些属性时填充这些属性。看看this回答。它可能类似,但可能与'text'绑定。示例:http://jsfiddle.net/rniemeyer/dLCL8/4/

答案 1 :(得分:7)

使用$data前缀,KO可以解析它

样品: http://jsfiddle.net/baryon/NsuL7/1/