淘汰控制台日志和可观察未定义

时间:2012-02-09 22:01:00

标签: javascript knockout.js

我看过有关控制台记录observables的评论,但它似乎对我不起作用。另外,我的应用程序没有启动我期望的默认var。 这两个问题在一起,因为我怀疑它们是以某种方式相关的。

Here is the fiddle

HTML

<select data-bind="options: widgets, optionsText: 'name', value: current_widget, optionsCaption: 'Choose...'"></select>
<input data-bind="value: current_widget() ? current_widget().name : 'nothing'" />

的Javascript

var cdta = {};
$(document).ready(function(){

    cdta.widgets_data = [{ "name": "foo", "id": "1"},{ "name": "bar", "id": "2"},{ "name": "bash", "id": "3"},{ "name": "baq","id": "4"}];

    cdta.local = {};
    cdta.local.current_widget = { "name": "foo", "id": "1"};

    alert('current_widget starting value should be: ' + cdta.local.current_widget.name);

    function app() {
        var self = this;

        //widgets
        self.widgets = ko.observableArray(cdta.widgets_data);

        // which widget to display from a local source
        alert('about to asign a current_widget named:' + cdta.local.current_widget.name);
        self.current_widget = ko.observable(cdta.local.current_widget);
    }
    ko.applyBindings(new app());

    alert('after applying bindings name of current widget: ' + current_widget().name);
    //expecting foo
    //but doesn’t alert because current_widget isnt defined
});

2 个答案:

答案 0 :(得分:2)

您的代码中存在几个问题。

  1. current_widget是app的一个属性,所以你需要做这样的事情

    var app = new app();
    ko.applyBindings(app);
    alert('after applying bindings name of current widget: ' + app.current_widget().name);
    
  2. 由于您正在使用value和optionsCaption出价,因此敲除会将默认情况下绑定到值的observable设置为undefined。如果删除optionsCaption绑定,它将起作用。如果您需要optionsCaption并且需要选择初始值,则必须在应用绑定后重置它:

    var app = new app();
    ko.applyBindings(app);
    app.current_widget(cdta.widgets_data[0]); //you have to select an object from the array, not a completely unrelated object cdta.local.current_widget
    alert('after applying bindings name of current widget: ' + app.current_widget().name);
    
  3. 更新: 我错了#2。应用绑定后,您不必重置值。真正的问题是你使用完全不相关的对象(而不是数组)作为初始值。这将解决问题:

    cdta.local.current_widget = cdta.widgets_data[0];
    

答案 1 :(得分:1)

但变量/方法current_widget确实未定义。 KnockoutJS不会产生全局变量。

如果你想访问viewModel之外的viewModel数据,那么你需要将它存储在某个地方(变量,窗口​​等)。

var cdta = {};
$(document).ready(function(){    
    //...    
    function app() {
       //...
    }
    window.app = new app();
    ko.applyBindings(window.app);

    alert('after applying bindings name of current widget: ' 
      + window.app.current_widget().name);
    //expecting foo
});