durandal - 检测小部件上的数据部分

Question

我有一个允许我传递数据部分的小部件。根据我是否将数据部分通知给该小部件的实例，我想从小部件中显示/隐藏某些内容。因此，如果为数据部分指定了某些东西，是否可以在我的小部件视图模型上检测到？

Answer 1

小部件的视图模型的activate方法被传递了一个settings对象（此代码来自Durandal 示例应用程序）：

ctor.prototype.activate = function(settings) {
    this.settings = settings;
};

在settings对象中，您可以检查parent属性，该属性将为您提供小部件绑定到的节点：

<div data-bind="expander:{items:projects}"></div>

这应该使您可以访问data-part节点上的属性。

Answer 2

您可以在小部件的事件回调中使用composition模块的getParts方法。attached请参阅http://durandaljs.com/documentation/api#module/composition/method/getParts

// MyWidget viewmodel
define(['durandal/composition'], function (composition) {
    var widget = function() {
        var plugin = this;

        plugin.showSomething = function () {
            something.show();
        );

        // See http://durandaljs.com/documentation/Interacting-with-the-DOM    
        plugin.attached = function (view, parent) {
            // See http://durandaljs.com/documentation/api#module/composition/method/getParts
            var dataparts = composition.getParts(view);

            plugin.parts = {
                $partOne: $(dataparts.datapartnameone),
                $partTwo: $(dataparts.datapartnametwo)
            };

            if (plugin.parts.$partOne) {
                // An element with data-part="datapartnameone" was found in the host container
                plugin.showSomething();
            }
        };
    };

    return widget;
});

// Example host container

<div data-bind="MyWidget: {}">
    <span data-part="datapartnameone">My data-part</span>
</div>