Question

我正在开发一个使用angularjs的应用程序。在这里我有一个登录页面，通向主页。登录页面由 loginCtrl 管理，进一步使用 loginService 。

这是loginctrl（登录控制器）

'use strict';
angular.module('dreamflow').controller('LoginCtrl', ['$scope', 'LoginService',
function($scope, LoginService) {
    $scope.title = "Login";
    $scope.master = {}

    $scope.login = function() {
        var user = {
            username: $scope.username,
            password: $scope.password
        };
        LoginService(user);
    };

}
]);

这是loginService

angular.module('dreamflow')
.factory('LoginService', function($http, $location, $rootScope) {
    return function(user) {
        $http.post('/login',{
                username: user.username,
                password: user.password
            }).then(function(response) {
            if (response.data.success) {
                console.log(response.data);
                $rootScope.user = response.data.user;
                $location.url('/');
            } else {
                console.log(response.data.errorMessage);
                $location.url('/');
            }
        });
    };
});

在上面的代码中，用户详细信息在检查响应成功后发出，然后我们被重定向到主页。我想在主页角度控制器中访问 $ rootScope.user 中的用户详细信息。

Answer 1

您可以拥有一个包含登录用户名的服务，该服务将注册到两个控制器中：

jsfiddle with '$scope'

另外，我发现使用＆＃39;这个＆＃39;而不是＆＃39; $ scope＆＃39;如果您在同一个地方使用多个控制器，则有助于不在彼此之间混合控制器范围。还有其他原因。

HTML：

<div ng-app="myApp">

    <div  ng-controller="ControllerOne as one">
        <h2>ControllerOne:</h2>
        Change testService.loginName: <input type='text' ng-model='one.myService.loginName'/> </br></br>
        myName: {{one.myService.loginName}}
    </div>
    <hr>
    <div ng-controller="ControllerTwo as two">
        <h2>ControllerTwo:</h2>
        myName: {{two.myService.loginName}}
    </div>

</div>

JS：

app.service('testService', function(){
    this.loginName = "abcd";
});

app.controller('ControllerOne', function($scope, testService){
    this.myService = testService;
});

app.controller('ControllerTwo', function($scope, testService){
    this.myService = testService;
});

jsfiddle with 'this'

在angularjs页面之间传递数据

1 个答案: