將元素添加到ListView的方法

Question

是否有將元素添加到ListView的方法？我的目標是在不綁定數據的情況下做到這一點例如：

 myListView.add("one"); 
    myListView.add("two"); 

ECC

Answer 1

只需簡單地將項目添加到您的初始列表。如果你有綁定設置，這會自動發生。

的Html

 
<div id="simpleBinding" data-win-control="WinJS.UI.ListView"></div> 

<div id="simpleBindingTemplate" data-win-control="WinJS.Binding.Template"> 
    <h3 data-win-bind="innerText:name" /> 
    <span>Name :</span><span data-win-bind="textContent: name"></span> 
    <img data-win-bind="src:imageUrl" /> 
</div> 

的Javascript

 


//Note you could also declare an object type to use here, 
//and instantiate them in the list below 
var Person = WinJS.Binding.define({ 
    name: "", 
    birthday: "" 
}); 

//Using the above object 
//var people = [ 
// new Person({ name: "Bob", birthday: "2/2/2002" }), 
// new Person({ name: "Sally", birthday: "3/3/2003" }), 
// new Person({ name: "Fred", birthday: "2/2/2002" }) 
//]; 


//Or simply using JSON 
var people = [{ name: 'mary', birthday: '1/1/2010' }, 
       { name: 'fred', birthday: '1/1/2012' }]; 

//create the binding wrapper 
var simpleFriends = new WinJS.Binding.List(people); 

//get the ref to your list view 
var simpleListView = document.getElementById('simpleBinding').winControl; 

//get your template 
var simpleTemplate = document.getElementById('simpleBindingTemplate'); 

simpleListView.itemDataSource = simpleFriends.dataSource; 
//can also set in the markup for this element 
simpleListView.itemTemplate = simpleTemplate; 


//add a new item. the binding update happens automatically 
//Could use a Person object we defined 
//simpleFriends.push(new Person({ name: "Dynamically added", birthday: "2/2/2002"})); 

//or JSON 
simpleFriends.push({ name: "Dynamically added", birthday: "2/2/2002"}); 
 

對於刪除的項目，您可以使用POP或檢查出這個職位索引方法 Removing an item from a WinJS.Binding.List

有在App Builder中一些好的內容綁定'Day 10'App Builder