Question

如果页面上有两个区域，即

<div ng-controller="LeftController">

</div>

<div ng-controller="RightController">

</div>

并且假设LeftController可以在没有RightController的情况下生存和存在。但是，如果RightController存在且某些内容发生变化......那么LeftController需要了解该变化。

LeftController如何知道订阅这些更改？这是否需要像Amplify这样的框架，或者这是否可以在Angular中处理？

USECASE

所以我正在解决的问题是屏幕上的一些标签。用户可以访问或不访问任一选项卡。

最初加载选项卡时，它会从服务器加载。

Tab 2（RightController）可以在Tab 1（LeftController）之前加载，如果Tab 1不存在或尚未加载，则Tab 2发布更改。什么都没发生。如果加载了选项卡1，则用户转到选项卡2，更改一个值，这可能会影响选项卡1中的UI。因此选项卡2会发布他已更改。标签1现在根据新信息更改所需内容。

Answer 1

有两种方法可以做到这一点：

使用事件（在范围内发出或广播）
使用服务/工厂

我已经用这两个选项做了一个东西。我希望它可以帮到你。

Plunker - Example

来源：

http://docs.angularjs.org/api/ng。$ rootScope.Scope http://docs.angularjs.org/guide/dev_guide.services.creating_services

Answer 2

您可以创建一个简单的服务并将其注入两个控制器。

app.factory('myService', function() {
    var onMessageCallbacks = [];
    var onMessage = function(cb) {
        onMessageCallbacks.push(cb);
    };

    var newMessage = function(msg){
        for (var cb in onMessageCallbacks) {
            onMessageCallbacks[cb](msg);
        }
    };

    return {
        onMessage: onMessage,
        newMessage: newMessage
    };
});

首先，您使用onMessage订阅活动：

app.controller('LeftController',
    function LeftController($scope, myService) {
        myService.onMessage(function(receivedMsg){
            // do sth...
        });
    }
);

当其中一个控制器想要说些什么时，请使用newMessage：

app.controller('RightController',
    function RightController($scope, myService) {
        myService.newMessage('Hello!');
    }
);

通知可能存在或不存在的控制器之间的更改

USECASE

2 个答案: