Question

根据问题的最佳答案：How to call custom Javascript functions from an AngularJS controller?。

我尝试了以下代码：

<body ng-app="FDAApp" ng-controller="formController">
<form ng-submit="login()">
    <input type="submit" ng-click="ngSubmit()">
</form>
<script type="text/javascript" >
    var app = angular.module('FDAApp', []);
    angular.module('FDAApp').factory('MyService', function($http) {
        var sessionKey='';
        return {
            sessionKey: sessionKey,
            login: function()
            {
                sessionKey="ABCD";
            }
        }
    });

    app.controller('formController', function ($scope, $http, $templateCache, $interval, $timeout, MyService) {

        $scope.sessionKey = '';
        $scope.sessionKey = MyService.sessionKey;

        $scope.login = function () {
            MyService.login();
            console.log($scope.sessionKey);
        }
    });
</script>
</body>

问题：我无法更新$ scope.sessionKey的值。有什么帮助吗？

Answer 1

当您更改基元而不是对象中的属性时，$ scope.sessionKey将保留旧会话密钥，新会话密钥是未跟踪的新实体。如果您希望以这种方式传播更改，则需要采用不同的策略。

您可以将$ scope传递给MyService以从服务中更改它，或者将MyService直接传递到范围中。

在范围内传递MyService：http://jsfiddle.net/3mrwLt65/

$scope.MyService = MyService

MyService.login()

// now $scope.MyService.sessionKey is your session key.

将$scope传递给MyService：

在控制器中：

MyService.login($scope);

在服务中，登录功能如下：

function(scope) {
   scope.sessionKey = <your session key>
}

您也可能希望this.sessionKey = 'ABCD'而不是sessionKey = 'ABCD'

Answer 2

简单地颠倒您的设计：服务不应更改任何$scope。

相反，让服务更改自己的数据并公开对象引用：

angular.module('FDAApp').factory('MyService', function($http) {
    var session = {
        key: ''
    };

    return {
        session: session,
        login: function()
        {
            session.key = "ABCD";
        }
    }
});

app.controller('formController', function ($scope, $http, $templateCache, $interval, $timeout, MyService) {

    $scope.session = MyService.session;

    $scope.login = function () {
        MyService.login();
        console.log($scope.session.key);
    }
});

Angularjs - 工厂服务无法访问$ scope对象

2 个答案: