如何在一个页面中多次组合相同的小部件

Posted 2023-03-27

【中文标题】如何在一个页面中多次组合相同的小部件

【英文标题】：How to compose same widget multiple times in a page

【发布时间】：2019-10-28 03:53:57

【问题描述】：

我有一个小部件说widget/userInfo

我使用compose，在我的视图中多次加载这个小部件，如下所示：

index.js：

activate() 
  this.widget = 
        model: 'widgets/userinfo/viewmodel',
        view: 'widgets/userinfo/view.html',
        activationData:  userId: 1 
    ;

HTML：

<div>
    UserInfo: <div id="1" data-bind="compose: $root.userInfo"></div>
    UserInfo-2: <div id="2" data-bind="compose: $root.userInfo"></div>
</div>

当我像上面一样多次组合同一个小部件时，它只会加载最后一个 id="2" 的 div。但我想为两个 div 加载它

我用谷歌搜索了这个问题，但找不到解决方案

【参考方案1】：

假设您正在谈论Durandal Widgets，并且小部件在应用程序启动时注册到widget.registerKind('userinfo')，我相信您应该使用这样的东西。

<div>
    UserInfo: <div id="1" data-bind="userinfo: data: $root.userInfo"></div>
    UserInfo-2: <div id="2" data-bind="userinfo: data: $root.userInfo"></div>
</div>

【讨论】：

我没有在应用程序启动时注册小部件。有没有在应用程序启动时注册的方法？

我相信它只需要在加载并绑定小部件的页面之前进行注册。