Question

我是淘汰赛的新手，我正在尝试创建一个可以在我的视图中绑定到的函数，以便将不同的输入框绑定到数组的不同元素。

不幸的是，在淘汰中调用函数的代码似乎是在填充数组之前发生的。我确信有一些简单的方法可以解决这个问题，但我已经尝试了一段时间而且无法弄清楚

(function () {

var BankingViewModel = function () {

    //data
    var self = this;
    self.safeFloatTotal = ko.observable(null);
    self.floatRecommendedValue = ko.observable(null);

    self.safeFloatDenominations = ko.observableArray();

        //populate the array 
        var safeFloatCash = bankingApi.client.getSafeFloatCash();
        safeFloatCash.done(function (d) {
            self.safeFloatDenominations(d);
        })


    self.GetNoteByDenomination = ko.computed( function () {
      //  return 1234; //will bind OK
        return self.safeFloatDenominations[1]; //length of the array is zero when this is called, so element is undefined

    });
}

$(document).ready(function () {
    var viewModel = new BankingViewModel();        
        ko.applyBindings(viewModel);        
});

})();

并在视图中

<div class="row">
                        <div class="col-xs-6">
                            <input type="text" data-bind="value: GetNoteByDenomination" />
                            <label>£50</label>
                        </div>
                        <div class="col-xs-6">
                            <input type="text" data-bind="value: safeFloatTotal" />
                            <label>50p</label>
                        </div>
                    </div>

我需要能够在初始化后调用数组，这就是我现在被困住的地方

Answer 1

如果您想访问可观察数组的第二个元素，则必须执行observable函数以获取基础数组：

self.GetNoteByDenomination = ko.computed(function () {
    return self.safeFloatDenominations().length > 1 ?
           self.safeFloatDenominations()[1] : "";
});

无论数组中有多少项，self.safeFloatDenominations[1]都会返回undefined。

Answer 2

var BankingViewModel = function(){
    var self = this;

    this.applyData = function(data){
        // map ur data response from api with the observablearray here
    };
}

$(document).ready(function(){
        var viewModel = new BankingViewModel();        
        ko.applyBindings(viewModel);   

        var safeFloatCash = bankingApi.client.getSafeFloatCash();
        safeFloatCash.done(function (d) {
             viewModel.applyData(d);
        })
});

淘汰javascript函数从数组中读取

2 个答案: