knockout js basic technology

最新推荐文章于 2020-09-11 02:38:10 发布

原创最新推荐文章于 2020-09-11 02:38:10 发布 · 130 阅读

0 ·

CC 4.0 BY-SA版权

knockout 专栏收录该内容

5 篇文章

订阅专栏

本文介绍如何在Ko.js中将所有列表推入ObservablesArray，并实现对象数组过滤。包括如何使用arrayPushAll方法进行列表操作，以及如何通过stringStartsWith方法过滤数组元素。

1. how to push all list into observal array

self.inverters = ko.observableArray([]);
self.loadInverters = function(inverters) {
	var array = self.inverters();
	ko.utils.arrayPushAll(array, inverters);
	self.inverters.valueHasMutated();
};

2. filter list for objserval array

function homeViewModel() {
	var self = this;
	self.teams = ko.observableArray([]);
	self.filterText = ko.observable("");
	self.filteredTeams = ko.computed(function() {
		if (self.filterText().length > 0) {
			var teamsArray = self.teams();			
			return ko.utils.arrayFilter(teamsArray, function(team) {
				 return ko.utils.stringStartsWith(team.location.toLowerCase(), self.filterText())
			});
		}
	});
}

3. multiple bind

<a data-bind="html: name, attr: { href: url }">

4. bind to simple array of strings

When using a template: ${$data}

When not using a template: $data

<ul data-bind="foreach: $root">
 <li data-bind="text: $data"></li>
</ul>

$root keyword does the trick.

<ul data-bind='foreach: list'>
    <li>
        <input data-bind='value: $parent.list[$index()]' />
    </li>
</ul>