淘汰赛视图模型属性未定义 [英] knockout viewmodel property undefined

问题描述

我有一个简单的 foreach:

<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 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 class="sectionOptions">

我正在尝试使它可以绑定到模型 {PersonId:33} 并且如果丢失，其余部分将不会呈现.当我尝试这个和其他方式时，我得到了

未捕获的错误:无法解析绑定.消息:ReferenceError:MailingAddress 未定义；绑定值:if:MailingAddress

我创建了一个简单的 jsfiddle 来测试:

http://jsfiddle.net/E7kUr/

解决方案

所以，您有几个选择:

1. 当您尝试绑定未定义的属性时，KO 会遇到问题，除非它们脱离对象.因此，您可以使用 $data. 为各种绑定添加前缀，KO 将能够解析您的绑定.示例:http://jsfiddle.net/rniemeyer/dLCL8/ 如果你知道几个属性总是在一起，那么您可以在这些选项周围使用 with 或 if 语句.

2. 处理未定义"属性的另一种方式是创建一个绑定，在这些属性丢失时填充这些属性.看看这个答案.它会类似，但可能带有文本"绑定.示例:http://jsfiddle.net/rniemeyer/dLCL8/4/

I have a simple 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>

I am trying to make it such that i can bind against a model {PersonId:33} and the rest will just not render if missing. when i try it this and other ways i get

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

I created a simple jsfiddle to test:

http://jsfiddle.net/E7kUr/

解决方案

So, there are a few options that you have:

1. KO will have an issue when you try to bind against undefined properties, unless they are off of an object. So, you can prefix your various bindings with $data. and KO will be able to parse your bindings. Sample: http://jsfiddle.net/rniemeyer/dLCL8/ If you know that several properties will always be together, then you could use a with or if statement around those options.

2. A different take on handling "undefined" properties is to create a binding that populates these properties when they are missing. Look at this answer. It would be similar, but potentially with the 'text' binding. Sample: http://jsfiddle.net/rniemeyer/dLCL8/4/

这篇关于淘汰赛视图模型属性未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！