Question

我努力争取这个问题，但基本上我只是开始使用angular并使用ngMaterial。我有一个使用角度工厂创建的吐司

app.factory('notify', ['$mdToast', '$animate', function($mdToast, $animate) {
    return {
        showToast: function(msg) {
             var toast = $mdToast.simple()
                  .content(msg)
                  .action('Close')
                  .highlightAction(false)
                  .position('top right');
            $mdToast.show(toast).then(function() {
              //
            });
        }
    }
}]);

如果我在页面上有一个用于激活toast的按钮，那么效果很好但是我有socket.io运行以及节点监视redis更新以弹出该通知。但是我无法让它工作，因为我不太确定如何从这里打电话给那家工厂

socket.on('notification.new', function (data) {        
    //call factory here to show toast
    console.log(data);
});

我知道如果我在控制器上有它，我可以使用

angular.element().scope().showToast(data)

但我不想创建一个元素只是为了容纳控制器来调用该函数。

Answer 1

我为解决这个问题所做的是将控制器内部的一个函数附加到window对象。像

这样的东西

window.showToast = function(msg) {
             var toast = $mdToast.simple()
                  .content(msg)
                  .action('Close')
                  .highlightAction(false)
                  .position('top right');
            $mdToast.show(toast).then(function() {
              //
            });

然后，从套接字io监听器（或任何原始的javascript）：

socket.on('notification.new', function (data) {        
    //call factory here to show toast
    window.showToast(data); //or however you'd like
});

那种对我有用。我知道这不是最好的方法，但由于这个问题根本没有任何答案，我认为我会发布一个至少完成工作的解决方法。

Answer 2

你需要掌握Angular服务才能在原始Javascript中使用Angular。

请参阅Call Angular JS from legacy code

angular.element（domElement）.scope（）获取元素的当前范围

angular.element（domElement）.injector（）获取当前的应用程序注入器

angular.element（domElement）.controller（）获取ng-controller实例的保留。

在您的情况下，使用injector服务来获取您的工厂。

更新1

$injector reference

用纯javascript调用角度工厂

2 个答案: