定义和访问$ rootScope与控制器的语法 [英] Define and Access $rootScope with controller as syntax

问题描述

我在使用控制器，当我需要定义一个$ rootScope变量值的麻烦。

I'm having trouble on using controller as when i need to define a $rootScope variable value.

该过程包括两个主要阶段。

The process consists of 2 main phases.

• 用户没有登录，所以当他处理登录表单，我会defini里面的$ rootScope他的个人数据（如姓名和身份证）的的LoginController 。


• 用户已经登录（与在localStorage的数据），所以我会从localStorage的得到他的数据和设置上的<$ C $的 $ rootScope 价值C> .RUN ;

• User is not logged, so when he process the login form I'll defini his personal data (like name and id) on the $rootScope inside the LoginController.
• User is already logged in (with data in the localStorage) so I'll get his data from the localStorage and set the $rootScope value on the .run;

但问题是，因为我是新来的这种类型的语法（用控制器与VM attr）使用了 $ rootScope 没有被定义，也不是由视图访问。

But the problem is, since I'm new to this type of syntax (using 'controller as' with vm attr) the $rootScope is not being defined nor being access by the view.

这是我在做什么：

angular
    .module('agApp')
    .run(runAuth);

    /* @ngInject */
    function runAuth($rootScope,factAuth,localStorageService) {

        var user = JSON.parse(localStorageService.get("user"));
        if (user.length > 0) {
            $rootScope.userData = user[0];
        }

        $rootScope.logOut = function() {
            factAuth.logOut();
            $rootScope.userData = '';
            $state.go('login');
        };

    }; //end run

控制器

angular
    .module('agApp')
    .controller('LoginController', LoginController);

    /* @ngInject */
    function LoginController($rootScope,$http,$state,localStorageService,factAutenticacao) {
        var vm = this;
        vm.pageName = 'Login page';

        vm.loginProccess = loginProccess;

        function loginProccess(event) {
            //here i get an $htt to validate the login
            if (!data) {
                alert('login failed')
            } else {
                factAutenticacao.loginProcess();
                localStorageService.set("user", JSON.stringify(data[0]));
                $rootScope.userData = data[0];
                $state.go('app');
            };
        };

    }; //end login controller

顺便说一下，定义一个全局函数时，如注销功能相同的问题发生。

By the way, the same problem happens when defining a global function, like the 'logOut' function.

和我的观点里，我试图像这样访问这个数据：

And inside my view, I'm trying to access this data like this:

<div class="col-l-12">
    <h3>User: {{::vm.userData.name}}</h3>
    <ul>
        <li> {{::vm.userData.id}}</li>
        <li> {{::vm.userData.location}}</li>
        [.. more code ..]
    </ul>
</div>

由于这是一个全局变量，我不想把它与关联特定控制器，因为它需要在整个应用程序进行访问。

Since it's a global var, i don't want to associate it with a particular controller because it needs to be accessible in the whole app.

什么是错的？

推荐答案

视图使用 vm.userData ，其中 VM 是控制器本身。所以，如果你想要的工作，用户数据必须是控制器的一个领域，而不是根范围内的领域：

The view uses vm.userData, where vm is the controller itself. So, if you want that to work, userData must be a field of the controller, not a field of the root scope:

vm.userData = data[0];

而不是

$rootScope.userData = data[0];

或者，如果你真的要存储在$ rootScope，则认为应该使用

Or, if you really want to store that on the $rootScope, then the view should use

{{ userData.name }}

从控制器范围内获得用户数据，并通过继承，从根范围。

to get the userData from the controller scope, and, by inheritance, from the root scope.

我同意虽然评论：不应该在根范围内。这应该是一个专门的服务，以任何控制器需要对用户数据访问注入进去。

I agree with the comments though: that shouldn't be in the root scope. It should be inside a dedicated service, injected in whatever controller needs access to the user data.

这篇关于定义和访问$ rootScope与控制器的语法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！