无法在Angular

时间:2016-02-16 13:04:08

标签: javascript angularjs

我的AngularJS中有factory

app.factory('userFactory', function($window) {
    var auth = {
        isLogged: false,      
        user: "a",
        check: function() {
            if ($window.sessionStorage.token) {
                this.isLogged = true;
            } else {
                this.isLogged = false;
                delete this.user;
            }
        }
    }
    return auth;
});

在AngularJS controller中,当点击button运行时,我将此静态用于测试。

// replace "a" with the following
app.controller('LoginCtrl', ['$scope', '$window', '$location', 'userFactory',
    function ($scope, $window, $location, userFactory) {     
        $scope.login = function(){
            var userCredentials = {
                "username": $scope.username,
                "password": $scope.password
            };
            if (userCredentials.username == "amir" && userCredentials.password == "blum") {
                userFactory.isLogged = true;
                userFactory.user = {
                    "name": "amir",
                    "surname": "blumenfeld"
                };
                $location.path("/customer");
            } else {
                alert("NO");
            }
        }
    }
]);

然后我尝试做:

function menuCtrl($scope, $location, userFactory, $window) {
    $scope.user = userFactory.user.surname;
}

所以“blumenfeld”应该在这里呈现

<ul ng-controller="menuCtrl">                
    <li><a href="#home">{{ user }}</a></li>                                                                                                    
</ul>

但我什么都没得到,只是一片空地。

请帮助我了解我做错了什么。我怎样才能解决这个问题?

由于

3 个答案:

答案 0 :(得分:1)

问题在于,您似乎在创建var myApp = angular.module('myApp', []); myApp.factory('userFactory', function($window) { var auth = { isLogged: false, user: "a" } return auth; }); function MyCtrl($scope, userFactory) { userFactory.user = {"name":"amir","surname":"blumenfeld","job":"crazy"}; $scope.user = userFactory.user.surname; } 时将$scope.user设置为userFactory.user.surname。换句话说,您的userasurnameundefined

然后在您的点击事件中,您将userFactory.user设置为对象。但由于$scope.user设置为未定义,因此无法知道它的值取决于userFactory.user且值未更改且始终为{{1 }}

如果您想要一些有用的东西,您必须将工厂中的对象设置为一个对象。在您的点击事件中,您必须更新值而不更改对象。

&#13;
&#13;
undefined
&#13;
var app = angular.module('MyApp', []);
app.factory('userFactory', function($window) {
    var auth = {
      isLogged: false,      
      user: {
         name: "a",
         surname: "a",
         job: "a",
      }
    }
    return auth;
  });

app.controller('menuCtrl2', ['$scope', 'userFactory', function($scope, userFactory){
  $scope.load = function () {
    userFactory.user.name = "amir"
    userFactory.user.surname = "blumenfeld"
    userFactory.user.job = "crazy" 
  }
}]);

app.controller('menuCtrl', ['$scope', 'userFactory', function($scope, userFactory){
  $scope.user = userFactory.user;
}]);
&#13;
&#13;
&#13;

这是使用方法的第二个版本:

&#13;
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="container" ng-app="MyApp">
  <div ng-controller="menuCtrl2">
     <button ng-click="load()">Load</button>
  </div>
  <div class="row" ng-controller="menuCtrl">
    {{user.surname}}
  </div>
</div>
&#13;
var app = angular.module('MyApp', []);
app.factory('userFactory', function($window) {
    var auth = {
      isLogged: false,      
      user: {
         name: "a",
         surname: "a",
         job: "a",
      }
    }
    return auth;
  });

app.controller('menuCtrl2', ['$scope', 'userFactory', function($scope, userFactory){
  $scope.load = function () {
    userFactory.user = {"name":"amir", "surname":"blumenfeld", "job":"crazy"};
  }
}]);

app.controller('menuCtrl', ['$scope', 'userFactory', function($scope, userFactory){
  $scope.user = function () {
    return userFactory.user.surname
  }
}]);
&#13;
&#13;
&#13;

答案 1 :(得分:0)

我复制粘贴您的代码,似乎正常工作look here

OnSuccess= handleData

答案 2 :(得分:-2)

尝试创建没有&#34;&#34;的用户对象。属性名称周围:

userFactory.user = {name:"amir",surname:"blumenfeld",job:"crazy"};