在 templateUrl 函数中使用 $rootScope [英] using $rootScope in templateUrl function

问题描述

我刚开始使用 angularJS，我有一个问题:如何在 templateUrl 函数中访问用 $rootScope 定义的变量?这是我的代码:

myApp.config(['$routeProvider',功能($routeProvider，$rootScope){$routeProvider.什么时候( '/'， {templateUrl: 'partials/login.html',控制器:'loginCtrl'}).当('/家'，{模板网址:函数($rootScope){控制台日志($rootScope.utilisateur.user.role_id)；如果($rootScope.utilisateur.user.role_id==2){返回 '​​partials/home.html';}否则返回 'partials/login.html';},控制器:'homeCtrl'}).否则({重定向到:'/'})；}]);

它告诉我 utilisateur 是未定义的.

我在索引控制器中定义:

$rootScope.utilisateur = null;$rootScope.rapports = null;

然后在 LoginCtrl 中:

 var user = Authentification.login(email,password);用户.成功(功能(响应){$rootScope.utilisateur = 响应；控制台日志($rootScope.utilisateur)；$location.path('/home');});

解决方案

您不能在配置块内使用 $rootScope，因为配置块在 $rootScope 创建之前运行.可以在配置块内部使用常量和提供者.如果常量不适合您，您可能需要重定向到 homeCtrl 中的正确 url.

从下面的评论中添加了可能的解决方案:

选项 1:有 2 条不同的路线

• /admin/home
• /home

选项 2:根据控制器/视图内部的权限切换模板

home.html

<div ng-switch-when="2"><!-- 是管理员-->
<div ng-switch-default><!-- 不是管理员-->

不是理想的解决方案，但根据您在下面的评论，它适用于您正在尝试做的事情

I just started with angularJS and I have a question: How can I access a variable defined with $rootScope in a templateUrl function? Here is my code:

myApp.config(['$routeProvider',
            function($routeProvider, $rootScope) {
              $routeProvider.
                when( '/', {
                  templateUrl: 'partials/login.html',
                  controller: 'loginCtrl'
                }).
                when( '/home', {
                  templateUrl: function($rootScope){
                      console.log($rootScope.utilisateur.user.role_id);
                      if ($rootScope.utilisateur.user.role_id==2){
                      return  'partials/home.html';
                      }
                      else return 'partials/login.html';
                  },
                  controller: 'homeCtrl'
                }).
                otherwise({redirectTo:'/'});
            }]);

It tells me that utilisateur is undefined.

I defined it in the index controller:

$rootScope.utilisateur = null;
$rootScope.rapports = null;

And then in the LoginCtrl:

 var user = Authentification.login(email,password);
    user.success(function(response){
        $rootScope.utilisateur = response;
        console.log($rootScope.utilisateur);
        $location.path('/home');
    });

解决方案

You cannot use the $rootScope inside of the config block, as the config block runs before the $rootScope is created. Constants and providers may be used inside of the config block instead. If constants are not an option for you, you may want to redirect to the correct url inside of your homeCtrl.

[EDIT] Added possible solution from comment below:

Option 1: Have 2 different routes

• /admin/home
• /home

Option 2: Switch templates according to permission inside of controller/view

home.html

<div ng-switch="utilisateur.user.role_id">
    <div ng-switch-when="2">
    <!-- is admin -->
    </div>
    <div ng-switch-default>
    <!-- not admin -->
    </div>
</div>

Not the ideal solution, but it'd work for what you are trying to do, based on your comments below

这篇关于在 templateUrl 函数中使用 $rootScope的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！