标签: knockout-2.0

我正在考虑使用Knockout或Angular或Backbone作为我的个人项目.我需要构建一些更大,更长时间运行的客户端交互,以配合我的服务器端.

我想要一种简单有效的方法来管理数据驱动的用户界面.

根据可行性和性能方面,您会选择哪个框架来解决上述问题？

在我的视图模型中,我有一个IsMale值,其值为true或false.

在我的UI中,我希望将其绑定到以下单选按钮:

<label>Male
   <input type="radio" name="IsMale" value="true" data-bind="checked:IsMale"/>
</label> 
<label>Female
   <input type="radio" name="IsMale" value="false" data-bind="checked:IsMale"/>
</label>

我认为这个问题checked需要一个字符串"true"/"false".所以我的问题是,如何通过这个UI和模型获得这种双向绑定？

在获得新值之前,是否可以在knockout中获取可观察的可观察量的当前值？

例:

this.myObservable = ko.observable();
this.myObservable.subscribe(function(newValue){
    //I'd like to get the previous value of 'myObservable' here before it's set to newValue
});

我正在使用KnockoutJS迭代一个对象,如下所示:

现在这一切都有效.但我的问题是,它设置id的button只是一个数字.所以它看起来像这样:

<button id="1">Button 1</button>
<button id="3">Button 2</button>
<button id="8">Button 3</button>

所以我试图在'Id'属性前加一个前缀,如下所示:

<div data-bind="foreach:Items">
    <button data-bind="text: Name, attr: {'id': 'myprefix_' + Id}"></button>
</div>

但这似乎并没有奏效.id当我这样做的时候,我会充满一些Knockout可观察功能......

所以我的问题是,当我指定id字段的属性时,如何添加前缀？

所以是的,我可以订阅一个可观察的数组:

vm.myArray = ko.observableArray();
vm.myArray.subscribe(function(newVal){...});

问题是newVal传递给函数的是整个数组.无论如何我只能得到三角洲部分？说添加或删除的元素？

我正在使用select2控件,通过ajax 加载数据.这需要使用<input type=hidden..>标签.

现在,我想检索选定的文本.(表达式中的value属性仅为data-bindsotres id)

我试过了$(".select2-chosen").text(),但是当我在页面上有多个select2控件时,这会中断.

另一位用户建议Knockout MVC处理一些AJAX发布问题.我读了一下它,我发现它是Knockout JS的一个包装器.所以我想知道两者之间真正的区别是什么？因为Knockout MVC存在,我应该为Knockout JS打扰吗？我何时会使用一个而不是另一个？

使用knockout时,使用只读计算的observable而不是简单函数有什么好处？

以下是viewmodel构造函数和html代码段,例如:

var ViewModel = function(){
    var self = this;
    self.someProperty = ko.observable("abc");
    self.anotherProperty = ko.observable("xyz");
    self.someComputedProperty = function(){
        return self.someProperty() + self.anotherProperty();
    };    
};

<input data-bind="value: someProperty"/>
<input data-bind="value: anotherProperty"/>
<p data-bind="text: someComputedProperty()"></p>

这里的一切似乎都像你期望的那样工作,所以我应该使用以下原因:

?var ViewModel = function(){
    var self = this;
    self.someProperty = ko.observable("abc");
    self.anotherProperty = ko.observable("xyz");
    self.someComputedProperty = ko.computed(function(){
        return self.someProperty() + self.anotherProperty();
    });    
};


<input data-bind="value: someProperty"/>
<input data-bind="value: anotherProperty"/>
<p data-bind="text: someComputedProperty"></p>

我注意到http://knockoutjs.com/documentation/computedObservables.html上的文档声明"...声明性绑定只是作为计算的observables实现",所以这是否意味着我需要在我的viewmodels中明确使用它们？

我需要$index+1在表格中显示.

如果我只是使用$index所有元素将从0开始,我需要从1开始.

这是淘汰赛的文档:http://knockoutjs.com/documentation/foreach-binding.html

在那里你可以找到这个例子:

<h4>People</h4>
<ul data-bind="foreach: people">
    <li>
        Name at position <span data-bind="text: $index"> </span>:
        <span data-bind="text: name"> </span>
        <a href="#" data-bind="click: $parent.removePerson">Remove</a>
    </li>
</ul>
<button data-bind="click: addPerson">Add</button>

所以它将显示以下内容:

人

位置0处的名字:Bert删除

第1位的名字:Charles删除

位置2处的名称:Denise删除

我真的需要它只是为了显示目的.

位置1的名字:Bert删除

名字在第2位:Charles删除

位置3处的名称:Denise删除

我没试这么成功 <span data-bind="text: ($index + 1)"> </span>

我的observableArray视图模型中有一个.创建vm后我希望完全替换数据observableArray.我是这样做的:

//Initial Setup
var vm = {};
vm.roles = ko.observableArray([]);
ko.applyBindings(vm); 


//....replace array later on....
vm.roles(["1", "2"]);

这似乎工作正常,但我担心这是不正确的,可能会导致内存泄漏.如果这是更新现有的首选方式,observableArray假设您希望替换其所有数据,那么任何人都可以遵守吗？

我注意到observableArray确实有一个removeAll()方法,并想知道是否需要调用它来干净地完成这项工作,或者我是否对我正在做的事情很好？