在不改变上下文的情况下使用foreach绑定Knockout.js

是否可以在不改变上下文的情况下使用foreach绑定？在不改变上下文的情况下使用foreach绑定Knockout.js

例如，这里是我的模板：

<div data-bind="foreach:{data:users,as:'user'}"> 
    <div data-bind="template:{name:'userAvatar',data:user}"></div> 
</div> 

<div data-bind="template:{name:'userAvatar',data:currentUser}"></div> 

<script type="text/template" id="userAvatar"> 
    <img data-bind="attr:{src:avatarUrl}"> 
</script>

于是我就用模板“userAvatar” foreach循环内部和外部的。现在我想在用户点击头像时执行一些操作。例如，我的模型是

var MyModel = function() { 
    this.users = [ 
    {name:"user1",avatarUrl:"url1"}, 
    {name:"user2",avatarUrl:"url2"} 
    ]; 
    this.currentUser = {name:"user3",avatarUrl:"url3"}; 
    this.openProfile = function() { 
    // opening user profile 
    } 
}

这种情况下，如果我想称之为“openProfile”模板动作我必须使用$ parent.openProfile当模板位于外的foreach和$家长[1] .openProfile，当它在里面。

我可以复制链接到openProfile到每个用户对象或指定openProfile方法的位置，当我调用模板绑定，但是有没有更自然的解决方案？

P.S.而且我不能使用$ root变量，因为在现实世界中，我的$ root根目录位于这些模型之上的10个级别。

来源

2013-02-13 Kasheftin

这是一个例子，在这里我可以用$根，但在真实情况我有多个嵌套模型，所以我的$ root很远，它甚至不知道当前的模型及其方法。 – Kasheftin 2013-02-13 13:00:28

我知道这是一个黑客，但你可以在当前用户tempalte周围使用'with' ...'<！ - ko with：currentUser - >

'然后你可以使用'$ parents [1] .openProfile '在这两种情况下。 – nemesv 2013-02-13 13:08:21

我的Repeat绑定执行类似于foreach的操作，但不创建子上下文。

<div data-bind="repeat:users" 
    data-repeat-bind="template:{name:'userAvatar',data:$item()}"></div>

适用于您的例子，因为它使用template另一种选择（也许更好），是foreach optiontemplate的：

<div data-bind="template:{name:'userAvater',foreach:users}"></div>

来源

2013-02-13 21:09:46

非常感谢，这就是我要找的。 – Kasheftin 2013-02-14 06:54:47

我刚刚意识到有一个更好的解决方案，我已将其添加到我的答案中。 – 2013-02-14 09:32:53

您可以将用户数组转换为对象并在该对象中实施点击操作。

function User(name,avatarUrl) { 
    var self = this; 

    this.name = ko.observable(name); 
    this.avatarUrl = ko.observable(avatarUrl); 

    this.openProfile = function() { 
     .... 
    } 
} 


users = ko.observableArray([new User(...),new User(...)]);

我认为这个行为自然属于用户模型而不是你的根模型。

来源

2013-02-13 14:17:37 Luffy

在不改变上下文的情况下使用foreach绑定Knockout.js

回答

相关问题