Breeze Durandal 从视图中访问外壳视图模型变量答案

【问题标题】：Breeze Durandal Access shell viewmodel variable from viewBreeze Durandal 从视图中访问外壳视图模型变量
【发布时间】：2013-05-19 06:09:53
【问题描述】：

我想要完成一件非常简单的事情，但我不知道如何或是否有可能。我开始使用热毛巾模板。在外壳视图模型中，我有一个用户可观察的。我希望能够引用从我网站上的其他页面观察到的用户。例如从主页。我尝试了几件事，但似乎我可以从组合视图访问 shell。我目前有一个可行的解决方案，它使用来自 shell 的事件发布/订阅调用将用户数据传递给任何在数据更改时监听的人（本示例中的主视图）。这行得通，只是看起来有点笨拙，并不是处理这个问题的理想方法。整个站点都需要使用此用户可观察对象，以确定某些功能何时可用并显示特定用户的项目。

有没有办法从主视图将数据绑定到包含在 shell 视图模型中的敲除 observable？

【问题讨论】：

标签： asp.net-mvc knockout.js breeze durandal

【解决方案1】：

您可能会考虑使用一个返回单例的 global.js，您可以根据需要将其包含在视图模型中。

define(function () {

    return {
        sharedObservable: ko.observable(),
        sharedObservableArray: ko.observableArray(),
        ...
    };
});

在视图模型中使用全局。

define([..., global], function (..., global) {
    ...
    global.sharedObservable('updated');

    // As an alternative use a local var for easier access
    // var localVar = global.sharedObservable;
    // localVar('updated') 
    ...

});

【讨论】：

我比以前的 pub/sub 更喜欢这个解决方案。我快速尝试了一下，似乎一切正常。感谢您的帮助。
为了标记 Rainer 的答案，我在过去几天刚刚学会了如何更进一步并在视图中使用 data-bind="text: global.sharedObservable" 来引用可观察的也来自 global.js。只需从您的视图模型中将全局公开给您的视图，一切都会保持愉快。我发现这有助于减少复制数据（例如使用 localVar(global.sharedObservable()); 然后在视图上显示 localVar）

【解决方案2】：

最简单的方法是使用 requirejs 将 shell 模块导入到您的视图模型中，然后将 shell 视图模型作为模块视图模型上的变量公开。

有点像这样：

// Some viewmodel
define(['shell'], function(shell){
     var vm = {
         shell: shell,
         ...
     };
     return vm;
});

那么在你看来，你可以使用 $root.shell 进行绑定

<span data-bind="text: $root.shell.shellObservable"></span>

【讨论】：

【解决方案3】：

以前的答案都不适合我。因此，我尝试了另一种访问 shell 的变体，它完成了工作。

我的 shell.js 中有这个：

    define(['plugins/router', 'durandal/app'], function (router, app) {
      return {
        // I need an access to this array in my view
        breadcrumbs: ko.observableArray([]), 
        ...
        };
   });

我认为这是：

define(function () {
    var ctor = function () {
        this.pageTitle = 'Preview';
        this.activate = function () {
            require('viewmodels/shell').breadcrumbs([...]);
        };
    };
    return ctor;
});

所以，require('viewmodels/shell') 实际上返回对一个 shell 对象的引用。

【讨论】：