Question

我是Angularjs的新手我创建了一个Angularjs服务来存储一些“全局”变量。它看起来像这样：

.factory('authVars', function() {
    var sdo = {
        baseBackendUrl: 'https://www.myurl.com',
        user: '',
        password: '',
        token: '',
        isLogged: false
    };
   return sdo;
})

现在我想在不同的控制器中使用ng-show / hide。

<div class="alert" ng-hide="authVars.isLogged">
    <strong>whatEver</strong>
</div>

这甚至可能吗？或者将它存储在rootScope中是否更好？为了一点帮助，我将非常感激;-) thx

Answer 1

只需将工厂注册到每个控制器即可。这是代码重用的目标服务。服务就像实用程序一样，你只需编写一次就可以在许多控制器中使用它

<强> JS

myApp.factory('authVars', function() {
    var sdo = {
        baseBackendUrl: 'https://www.myurl.com',
        user: '',
        password: '',
        token: '',
        isLogged: false
    }; 

    return {
        getSdo: function() {
            return sdo;
        }
    };

})


function MyCtrl($scope, authVars) {

    $scope.authVars = authVars.getSdo();
}

演示 Fiddle

Answer 2

将它投入使用是完全可以的！只是不要忘记将其注入相关的控制器：

var Ctrl = function($scope,authVars){
    $scope.authVars = authVars;
}

示例：http://jsfiddle.net/cherniv/pzFrs/2/

Answer 3

您需要在控制器中注入服务，如下所示。

  app.controller('ctrl',function($scope, authVars){          
    $scope.authVars=authVars;   
  });

Answer 4

是的，这要归功于依赖注入系统您可以在您需要的每个控制器中“注入”此服务。

假设你有一个这样的模板：

<div ng-controller="MyController">
  <div class="alert" ng-hide="authVars.isLogged">
    <strong>whatEver</strong>
  </div>
</div>

然后你必须有一个像这样定义的控制器：

.controller('MyController', function (authVars) {
  $scope.authVars = authVars;
});

Answer 5

有几种方法可以在angular中使用constans：

使用 angular.constant

angular.module('myApp.config', []).
   constant('APP_NAME', 'MyApp');

angular.module('myApp.controllers', ['myApp.config'])
  .controller('AppCtrl', ['$scope', 'APP_NAME', function($scope, appName) {
     $scope.val = appName;
}]);

使用 angular.value

angular.module('myApp.config', []).
   value('config', {
      appName: 'AppName'
   });

angular.module('myApp.controllers', ['myApp.config'])
  .controller('AppCtrl', ['$scope', 'config', function($scope, config) {
     $scope.val = config.appName;
}]);

或者你的方式，但工厂经常用于在返回配置对象之前设置一次，例如$注入一些依赖项（如$ locale）。

此外，我经常使用指令 consts 来附加我想要的范围中的常量：

angular.module('myApp.config', []).

directive('consts', function(config) {
    return {
      restrict: 'A',
      link: function($scope) {
         $scope.config = config;
      }
    }
});

然后：

<div consts>
  <h2>{{config.appName}}</h2>
</div>

所有控制器模板中的Angularjs服务变量

5 个答案: