GitHub
Twitterlist
live.list(el, list, render, context, [parentNode])
Live binds a compute's list incrementally.
// a compute that change's it's list
var todos = compute(function(){
return new Todo.List({page: can.route.attr("page")})
})
var placeholder = document.createTextNode(" ");
$("ul#todos").append(placeholder);
can.view.live.list(
placeholder,
todos,
function(todo, index){
return "<li>"+todo.attr("name")+"</li>"
});
Parameters
- el
{HTMLElement}:An html element to replace with the live-section.
- list
{Object}:An observable value or list type. If an observable value, it should contain a falsey value or a list type.
- render
{function(index, index)}:A function that when called with the incremental item to render and the index of the item in the list.
- context
{Object}:The
thistherenderfunction will be called with. - parentNode
{HTMLElement}:An overwritable parentNode if
el's parent is a documentFragment.
How it works
If list is an observable value, live.list listens to changes in in that
observable value. It will generally change from one list type (often a list type that implements onPatches)
to another. When the value changes, a diff will be performed and the DOM updated. Also, live.list
will listen to .onPatches on the new list and apply any patches emitted from it.