0

我想将数据传递给以下模型，但由于模型是使用“with”语句绑定的，它似乎在页面加载时触发，并且错误说“名称”未定义。

<div data-bind="with: aFunction()">
    <div data-bind="text: test"></div>
    <input data-bind="value: test, valueUpdate: 'afterkeydown'"></input>
</div>


var viewModel = function(){
    var self = this;
    var data = {Name : "Mark"};

    self.aFunction = function (data){
        var self = this;
        self.test = ko.observable(data.Name);  
        return self;
    }

    self.aFunction(data);

};
ko.applyBindings(new viewModel());
4

2 回答 2

0

两件事情：

  1. 因为您正在绑定到aFunction()，所以您实际上是在执行该函数（当绑定应用于页面加载时）并尝试绑定with: [function result]

  2. 我不确定您是否可以绑定with到函数结果。通常这是通过当前绑定上下文的属性完成的（正如@lazyberezovsky 在他的回答中用“名称”属性说明的那样）

于 2013-06-14T21:40:07.160 回答
0

使用with绑定时，您必须记住它会更改您当前所在的绑定上下文。

现在，坦率地说，您的模型有一个非常奇怪的设置，因为它的行为更像一个可观察工厂，生产可观察对象而不是包含可观察对象。

如果我们将您的模型更改为更传统的方法，如下所示：（这个例子很容易说明您在哪里走错了路）

模型：

var viewModel = function(data){
    var self = this;
    self.Test = ko.observable();

    self.load = function(data) {
        if (data) {
            self.Test({ name: ko.observable(data.name) });
        }   
    };
    self.load(data);
};

var data = { name: 'Matt' };
ko.applyBindings(new viewModel(data));

html:

<!-- Once inside this markup, the scope changes to the things contained 
inside of Test(). Therefore your aliasing needs to look like the following -->
<div data-bind="with: Test">
    <div data-bind="text: name"></div>
    <input data-bind="value: name, valueUpdate: 'afterkeydown'"></input>
</div>

JsFiddle：

这是一个jsfiddle来演示这个例子

解释：

请务必注意有关 with 绑定的文档：

with 绑定创建一个新的绑定上下文，以便将后代元素绑定在指定对象的上下文中。

... with 绑定将根据关联值是否为空/未定义动态添加或删除后代元素

这个斜体部分解释了为什么在我的示例中使用 With 绑定不会因为 observableTest()为 null 或 undefined 而引发错误；框架通过动态删除所有后代元素来处理这种情况。这在我的 jsfiddle 中得到了证明。

另请注意，我为属性内的对象提供了一个名为的属性name，以便我可以显式绑定到它。如果您在属性本身上使用 with 绑定，您会遇到一些尝试将其作为属性绑定的技巧，因此您最好只拥有显式属性 IMO。

希望这会有所帮助

于 2013-06-14T23:34:23.567 回答