Question

我不明白为什么顶部绑定不起作用，但声明“with”确实有用。

I have set up the question on JSFiddle here

Why does this not appear when it is bound to Info.Title?
<div data-bind="text: Info.Title"></div>

<hr/>
But this does when I use the with statement?
<div data-bind="with: Info">
    <div>
         <h1 data-bind="text: Title"></h1>

    </div>
</div>

Answer 1

第一个绑定绑定到Title observable的Info属性（未定义）。完成ajax调用后，Info对象被替换 - Info.Title不再是最初绑定的Info.Title。

然而，在with:范围内，我相信当Info observable被更改时，该范围内的绑定会被重新评估，因此新Title被重新绑定正确。

要修改它，您需要不替换Info，但在完成ajax时会更新其observable。此外，Info本身不需要是可观察的。这是一个经过编辑的小提琴，有一个建议：http://jsfiddle.net/PQkJb/

Answer 2

问题是当最初发生绑定时，您的Info属性是未定义的。我更新了向VM添加一个方法，检查是否填充了Info，然后返回Title。这是JSFiddle上的更新示例。更新的绑定代码就是这样，调用VM函数：

<div data-bind="text: GetTitle()"></div>

更新的VM如下所示，请注意最后添加的功能：

function DareDetailViewModel() {
    var self = this;
    self.Info = ko.observable();

    var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
    $.getJSON(flickerAPI, {
        format: "json"
    })
    .done(function (data) 
    {
        self.Info(new MapInfo(data));
        console.log(data);
    });

    self.GetTitle = function() {
        if(self.Info())
            return self.Info().Title();
    };
};

另一个选项是使用一个也具有初始Title的对象初始化Info属性。但这似乎是更长的方式，所以我没有。：）

为什么这个Knockout绑定不起作用？

2 个答案: