Fatal编程技术网
  • angularjs/
  • Angularjs 我是否可以在每个控制器中使用angular？

Angularjs 我是否可以在每个控制器中使用angular？

angularjs function

Angularjs 我是否可以在每个控制器中使用angular？,angularjs,function,global,Angularjs,Function,Global,如果我有一个实用函数foo，我希望能够从ng应用程序声明中的任何位置调用该函数。是否有某种方法可以使其在模块设置中全局可访问，或者是否需要将其添加到每个控制器的作用域中 基本上有两种选择，要么将其定义为服务，要么将其放在根范围内。我建议您使用它来提供服务，以避免污染根范围。创建服务并使其在控制器中可用，如下所示： <!doctype html> <html ng-app="myApp"> <head> <script src="http://co

如果我有一个实用函数
foo
，我希望能够从
ng应用程序
声明中的任何位置调用该函数。是否有某种方法可以使其在模块设置中全局可访问，或者是否需要将其添加到每个控制器的作用域中

基本上有两种选择，要么将其定义为服务，要么将其放在根范围内。我建议您使用它来提供服务，以避免污染根范围。创建服务并使其在控制器中可用，如下所示：

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.factory('myService', function() {
        return {
            foo: function() {
                alert("I'm foo!");
            }
        };
    });

    myApp.controller('MainCtrl', ['$scope', 'myService', function($scope, myService) {
        $scope.callFoo = function() {
            myService.foo();
        }
    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="callFoo()">Call foo</button>
</body>
</html>

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.run(function($rootScope) {
        $rootScope.globalFoo = function() {
            alert("I'm global foo!");
        };
    });

    myApp.controller('MainCtrl', ['$scope', function($scope){

    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="globalFoo()">Call global foo</button>
</body>
</html>


var myApp=angular.module（'myApp'，[]）；
myApp.factory（'myService'，function（））{
返回{
foo:function（）{
警惕（“我是福！”）；
}
};
});
myApp.controller（'MainCtrl'，['$scope'，'myService'，function（$scope，myService）{
$scope.callFoo=函数（）{
myService.foo（）；
}
}]);
打电话给福
如果这不是您的选项，您可以将其添加到根范围，如下所示：

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.factory('myService', function() {
        return {
            foo: function() {
                alert("I'm foo!");
            }
        };
    });

    myApp.controller('MainCtrl', ['$scope', 'myService', function($scope, myService) {
        $scope.callFoo = function() {
            myService.foo();
        }
    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="callFoo()">Call foo</button>
</body>
</html>

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.run(function($rootScope) {
        $rootScope.globalFoo = function() {
            alert("I'm global foo!");
        };
    });

    myApp.controller('MainCtrl', ['$scope', function($scope){

    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="globalFoo()">Call global foo</button>
</body>
</html>


var myApp=angular.module（'myApp'，[]）；
myApp.run（函数（$rootScope）{
$rootScope.globalFoo=函数（）{
警惕（“我是全球食物！”）；
};
});
myApp.controller（'MainCtrl'，['$scope'，函数（$scope）{
}]);
呼叫全球foo
这样，您的所有模板都可以调用
globalFoo（）
，而无需将其从控制器传递到模板。

尽管第一种方法被提倡为“类似角度的”方法，但我觉得这会增加开销

考虑一下我是否想在10个不同的控制器中使用myservice.foo函数。我必须指定这个“myService”依赖项，然后在所有十个属性中指定$scope.callFoo scope属性。这只是一种重复，而且在某种程度上违反了干燥原则

然而，如果我使用$rootScope方法，我只指定一次这个全局函数gobalFoo，它将在我未来的所有控制器中可用，不管有多少个控制器

我想你也可以把它们结合起来：

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
        var myApp = angular.module('myApp', []);

        myApp.factory('myService', function() {
            return {
                foo: function() {
                    alert("I'm foo!");
                }
            };
        });

        myApp.run(function($rootScope, myService) {
            $rootScope.appData = myService;
        });

        myApp.controller('MainCtrl', ['$scope', function($scope){

        }]);

    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="appData.foo()">Call foo</button>
</body>
</html>


var myApp=angular.module（'myApp'，[]）；
myApp.factory（'myService'，function（））{
返回{
foo:function（）{
警惕（“我是福！”）；
}
};
});
运行（函数（$rootScope，myService）{
$rootScope.appData=myService；
});
myApp.controller（'MainCtrl'，['$scope'，函数（$scope）{
}]);
打电话给福
AngularJs拥有“服务”和“工厂”，仅用于解决像您这样的问题。它们用于在控制器、指令、其他服务或任何其他AngularJs组件之间具有全局性。您可以定义函数、存储数据、，在服务中创建calculate函数或任何您想要的函数，并在AngularJs组件中作为全局使用它们

angular.module('MyModule', [...])
  .service('MyService', ['$http', function($http){
    return {
       users: [...],
       getUserFriends: function(userId){
          return $http({
            method: 'GET',
            url: '/api/user/friends/' + userId
          });
       }
       ....
    }
  }])
如果你需要更多

我比Angular更新了一点，但我发现做一件有用的事（而且非常简单）就是我先创建一个全局脚本，然后加载到我的页面上，然后再创建一个本地脚本，其中包含所有页面都需要访问的全局变量。在该脚本中，我创建了一个名为“globalFunctions”的对象，并添加了作为属性全局访问所需的函数。e、 g.
globalFunctions.foo=myFunc（）。然后，在每个本地脚本中，我编写了
$scope.globalFunctions=globalFunctions
并且我可以立即访问我在全局脚本中添加到globalFunctions对象的任何函数


这是一个解决方法，我不确定它是否对您有帮助，但它确实对我有帮助，因为我有很多功能，将所有功能添加到每个页面是一件痛苦的事情。
控制器“记录”他们在哪里获得全球服务呼叫可能有一些价值。如果您将一个控制器猛拉到另一个应用程序中，则不太清楚全局函数来自何处。我听说你承认你的论点。如果你需要从视图调用它，它只需要放在范围内。在控制器中，您可以直接从服务调用它。这是一个注释而不是一个应答$rootScope变量在页面刷新时始终为null，在这种情况下，您将无法获得该函数。这就是为什么注入服务并在应用程序中使用其引用很好的原因。我不是100%确定这一点，但是您也可以在您的模块上这样定义它：
module.value（'myFunc'，function（a）{return a；}）
然后按名称将其注入控制器中。（如果想要避免提供服务）这意味着我必须手动将其添加到每个控制器中$rootScope是实现我两年前想做的事情的途径=）好的。：）我只是比普通控制器更经常地使用具有隔离作用域的指令，而且我必须注入所有内容。我喜欢它提供的模块化代码风格。此外，您不必以任何方式干扰父范围，也不必搜索太多范围变量的来源。：）在第一个解决方案中，如果有大量的
foo（）
函数，该怎么办？为它们中的每一个制作一个
$scope.callFoo（）
包装器太麻烦了。如何将库的所有函数“附加”到作用域中，以便在模板中使用？我有一个大的单位转换库，我希望它可以在我的模板上使用。我的问题也是。我尝试过这个方法，效果很好：你可以通过说
$scope.callFoo=myService.foo来“附加”它代替在每个您想使用的地方创建新包装。感谢您的帮助，我想知道如何在我的应用程序中提供更改语言功能，$rootScope完成了这项工作。我希望将翻译模块与应用程序分开，这样我就可以将其插入其他应用程序。我建议使用角度值，而不是工厂值