knockout页面中绑定model有两种方式,ko.applyBindings 和 ko.attach
ko.applyBindings
- 可以声明成使用data-bind的HTML元素或者容器。 ko.applyBindings(myViewModel,document.getElementById(‘someElementId‘))
- 第二个参数可选。
- 可以在同一个页面声明多个view model,用来区分区域。
- 代码
//Knockout数据绑定
var ViewModel = function() {};
var jsonArray = [];
var viewModel = new ViewModel();
viewModel.data = ko.observableArray(jsonArray);
ko.applyBindings(viewModel, document.getElementById("content"));
//使用后已监控属性数据,后期只改变viewModel.data数据即可实现view层同步刷新。
var cntModel = {};
cntModel.total_count = ko.observable("0");
ko.applyBindings(cntModel, document.getElementById("header"));
ko.attach
<script src="Scripts/jquery-1.7.1.js" type="text/javascript"></script>
<script src="Scripts/knockout-3.1.0.js" type="text/javascript"></script>
<script type="text/javascript" src="Scripts/jquery.livequery.js"></script>
<!--Plugin-->
<script type="text/javascript" src="Scripts/knockout.multimodels-0.1.js"></script>
<div data-model="viewModel">
<ul>
<li data-bind="foreach:data">
<span data-bind="text:name"></span>
</li>
</ul>
</div>
var ViewModel = function() {};
var jsonArray = [];
var viewModel = new ViewModel();
viewModel.data = ko.observableArray(jsonArray);
ko.attach('viewModel',viewModel);
坑
+ 使用ko.applyBindings时, 如果存在多个Model,其中任意一个Model被指定了元素,其余的Model 也需要指定元素。
+ 数据已经获取到并且改变了,但是页面内容未改变,原因可能是又重新监控了一次,多写了一次viewModel.data = ko.observableArray(jsonArray);查查看试试删除。