Question

我正在尝试使用angular $ emit和命令文件在页面加载期间显示一个微调器。我的模特是：

Model:

    model.load = function(){
        model.loading = true;
        $rootScope.$emit('loadMyPage', model.loading);
        return service.getData().then(storesResult, storesFault);
    }


       var storesResult = function (value) {
        model.categoriesLoading = false;
        $rootScope.$emit('loadMyPage', model.loading);
        model.stores = value.result;
        saveData();
    };

    var storesFault = function (value) {
        var data = value.data;
        var status = value.status;
        model.categoriesLoading = false;
        model.stores = null;
        $rootScope.$emit('loadMyPage', model.loading);
        $rootScope.$emit('systemAlert', {title: 'Loading Error', message: data, status: status, type: 'danger', timeout: 10000, showAsModal: true});
        return value;
    };

我的命令文件，在app.run中执行

command.execute = function () {
            $rootScope.$on('loadMyPage', onLoadingChange);
        };

        var onLoadingChange = function (event, value) {
            if (model.loading === true) {
                showModal('sections/modals/loading/loading.tpl.html');
            } else {
                hideModal();
            }
        };
};

问题是在页面加载期间，model.load中的$ emit不会在命令中转到$ on。调用$ on时，它将从storesResult块完成。因此，model.loading总是变得错误。这可能是一个异步问题。

欢迎所有建议。

Answer 1

也许不要使用$ emit和$ on。如果您有$ rootscope对象，只需使用您的键值对或您要检查的任何数据创建一个键。您的数据可能正如您所期望的那样，或使用$ watch等待它，或者仅使用$ rootscope回调。

getopt_long()

<强>无论其

也许$ rootScope不是污染属性的最佳方法。我会把那个留给你。

同时

快速帮助$ emit和$ broadcast

控制器被实例化，$ scope DI'd =＆gt; link （不是单身人士）;

这是广播和发射的工作方式。注意下面的节点;全部嵌套在节点3中。当您拥有此场景时，您将使用广播并发出。

Model: model.load = function(){ // model.loading = true; $rootScope.isLoading = true; return service.getData().then(storesResult, storesFault); } var storesResult = function (value) { model.categoriesLoading = false; $rootScope.isLoading = true; model.stores = value.result; saveData(); }; var storesFault = function (value) { var data = value.data; var status = value.status; model.categoriesLoading = false; model.stores = null; $rootScope.isLoading = true; $rootScope.$emit('systemAlert', {title: 'Loading Error', message: data, status: status, type: 'danger', timeout: 10000, showAsModal: true}); return value; }; command.execute = function () { $rootScope.$watch('isLoading', onLoadingChange); }; var onLoadingChange = function ( value ){ if (value === true) { // or simply if( value ) showModal('sections/modals/loading/loading.tpl.html'); } else { hideModal(); } }; };

查看此树。你如何回答以下问题？ 注意：还有其他方法，但在这里我们将讨论广播和发射。此外，当阅读下面的文本时，假设每个数字都有自己的文件（指令，控制器）e.x. one.js，two.js，three.js。

1 如何与 3 对话？

在文件one.js
中
3 -------- | | --- ---- 1 | 2 | --- --- --- --- | | | | | | | |

在文件three.js
中
scope.$emit('messageOne', someValue(s));

2 如何与 3 对话？

在文件two.js
中
scope.$on('messageOne', someValue(s));

在文件three.js
中
scope.$emit('messageTwo', someValue(s));

3 如何与 1 和/或 2 对话？

在文件three.js
中
scope.$on('messageTwo', someValue(s));

在文件one.js＆amp;＆amp; two.js 您要捕获消息的文件 。

scope.$broadcast('messageThree', someValue(s));

2 如何与 1 对话？

在文件two.js
中
scope.$on('messageThree', someValue(s));

在文件three.js
中
scope.$emit('messageTwo', someValue(s));

在文件one.js
中
scope.$on('messageTwo', function( event, data ){ scope.$broadcast( 'messageTwo', data ); });

<强>无论其

当你让所有这些嵌套的子节点试图像这样进行通信时，你会很快看到许多$ on的$ broadcast和$ emit的。这就是我喜欢做的事情。

在PARENT NODE （本例中为三个......）

所以，在文件three.js
中
scope.$on('messageTwo', someValue(s));

现在，在任何子节点中，您只需 $ emit 消息或使用 $ on 捕获消息。

注意：通常很容易在一个嵌套路径中串口而不使用$ emit，$ broadcast或$ on，这意味着大多数用例都适用于您尝试获取< strong> 1 与 2 进行通信，反之亦然。

2 如何与 1 对话？

在文件two.js

scope.$on('pushChangesToAllNodes', function( event, message ){
  scope.$broadcast( message.name, message.data );
});

在文件three.js

scope.$emit('pushChangesToAllNodes', sendNewChanges());

function sendNewChanges(){
  return { name: 'talkToOne', data: [1,2,3] };
}

在文件one.js

We already handled this one remember?

您仍然需要对要捕获的每个特定值使用$ on，但现在您可以在任何节点中创建任何您喜欢的内容，而无需担心如何在父级差距中获取消息

希望这会有所帮助......

使$ emit以同步方式工作

1 个答案: