knockout.js 绑定(bind)到静态数据

标签 knockout.js

绑定(bind)到现有静态数据的建议方法是什么?我必须将其包含在 View 模型中,因为它用于计算值。

http://jsfiddle.net/z2ykC/4/

<div id="sum" data-bind="text: sum">
</div>
<div class="line">
    dynamic: <span data-bind="text: dynamicValue"></span>
    static: <span data-bind="text: staticValue">312</span>
    <button data-bind="click: getDataFromServer">get data</button>
</div>
<div class="line">
    dynamic: <span data-bind="text: dynamicValue"></span>
    static: <span data-bind="text: staticValue">123</span>
    <button data-bind="click: getDataFromServer">get data</button>
</div>

function SumViewModel(lines){
    this.sum = ko.computed(function(){
        var value = 0;
        $.each(lines, function(index, element){
            var staticValue = element.staticValue();
            if (staticValue)
                value += staticValue;
            var dynamicValue = element.dynamicValue();
            if (dynamicValue)
                value += dynamicValue;
            value += dynamicValue;
        });
        return value;
    });
}

function LineViewModel() {

    this.randomNumber = function(max) {
        return Math.floor((Math.random() * max) + 1);
    };

    this.dynamicValue = ko.observable(0);
    this.staticValue = ko.observable();

    this.getDataFromServer = function() {
        this.dynamicValue(this.randomNumber(300));
    };

};

var lines = [];
$('.line').each(function(index, element) {
    var line = new LineViewModel()
    //line.staticValue(parseInt($('[data-bind*="staticValue"]', element).text()));
    lines.push(line);
    ko.applyBindings(line, element);
});
var sum = new SumViewModel(lines);
ko.applyBindings(sum, $('#sum')[0]);

最佳答案

您可以考虑创建自定义绑定(bind),这将初始化 staticValue 可观察对象。这是一个工作 fiddle :

http://jsfiddle.net/z2ykC/6/

关于knockout.js 绑定(bind)到静态数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11011374/

相关文章:

javascript - Knockout、Web API 和 SignalR - 未捕获的类型错误

data-binding - 从子元素访问 knockout 绑定(bind)

Javascript 框架 : Knockout, 主干、嵌入……

javascript - KnockoutJS 复选框列表不绑定(bind)所选值

javascript - 访问 JavaScript 数组的元素

knockout.js - ViewModel 更新后 Knockout 不更新 UI

css - "Advanced" knockout css 绑定(bind)语句的行为不完全符合预期

knockout.js - knockout 复选框更改事件发送旧值

javascript - 克隆可观察对象的最佳方法?

javascript - Knockout - 将样式应用于 Bootstrap Select 中的选定元素