Knockout JS选择框问题

时间:2017-03-27 09:23:02

标签: knockout.js mootools knockout-3.0

我正在使用淘汰赛3.4.0和我的项目以及MooTools。我需要存储字段信息。其中一个信息是通过KO加载的选择框。

<select data-bind="options: agencyContacts,optionsText: 'name',optionsValue:'id' , optionsCaption: 'Please select...',value:agencyContactSelected">

信息保存在数据库中。虽然从DB加载了相同的信息,但我需要使用相应的DB条目自动选择选择框。我的ViewModel位于下方。

var vm={};
var Information = {

    Implements: [Options, Events],

    /**
     * Method: initialize
     *
     * Parameters:
     *  options (object) - the options object
     */
    initialize: function(options) {

        var self = this;
        self.draw();
    },
     draw: function() {
        vm.agencyContactViewModel.agencyContactSelected(<ID>);
     }
}

var agencyContactViewModel = function() {
    var self = this;
    self.agencyId = ko.observable();
    self.agencyContacts = ko.observableArray();
    self.agencyContactSelected = ko.observable();
    self.agencyContactSelected.subscribe(function(newAgencyContactSelected) {
            alert(newAgencyContactSelected);
    });

    self.agencyId.subscribe(function(newAgencyId) {
        self.agencyContacts.removeAll();
        self.address();
        var submitObj = {
            'contactId': newAgencyId
        };
        var myRequest = new ReqJSON({
            'url': '/gateway?file=contacts.views&method=getContactRefs',
            onSuccess: function(responseJSON) {
                if (responseJSON.length > 0) {
                    var length = responseJSON.length;
                    for (var i = 0; i < length; i++) {
                        self.agencyContacts.push(responseJSON[i]);
                    }
                }
            }
        }).send(JSON.encode(submitObj));
    });
}

 myInformation = new Information();

 window.addEvent('domready', function() {
    vm.agencyContactViewModel = new agencyContactViewModel();
    ko.applyBindings(vm.agencyContactViewModel, document.getElementById('agency_contact_wrapper'));
});

虽然我为选择框设置了正确的ID,但是'agencyContactSelected'可观察对应的订阅功能被调用两次,首先是来自DB的ID,第二次是未定义的值。由于此未定义值,未设置选择框。可能是什么原因?

PS:如果我从HTML中删除'value:agencyContactSelected',则会正确调用subscribe,即使用DB值调用一次。

1 个答案:

答案 0 :(得分:0)

我在你的问题中看到了几个令人惊讶的元素:

  1. 为什么使用optionsValue?这似乎没什么用处
  2. draw功能中,您拨打agencyContactViewModel.agencyContactSelected,但agencyContactViewModel是一个功能。对viewmodel的函数和属性使用相同的名称是非常棘手的,你应该避免它
  3. 我没有看到您vm变量的定义