Angularjs - 工廠服務無法訪問 $scope 對象

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 個解決方案

解決方案1
0 2014-12-18 09:05:08

解決方案2
0 2014-12-18 09:11:11

Angularjs - 工廠服務無法訪問 $scope 對象

問題描述

2 個解決方案

解決方案1 0 2014-12-18 09:05:08

解決方案2 0 2014-12-18 09:11:11

解決方案1
0 2014-12-18 09:05:08

解決方案2
0 2014-12-18 09:11:11