重新定义的变量不会在AngularJS中绑定

时间:2015-04-02 18:54:26

标签: javascript angularjs data-binding angularjs-scope

我是Angular的新手,我遇到了一个创建应用程序的错误,当绑定的对象值发生变化时,单个AngularJS绑定不会更新。

这是应用程序的缩小版本,因此它的结构就像它一样。这是HTML:

<div ng-app="userLogin">
  <div ng-controller="loginCtrl">{{currentUser.name}}</div>
</div>

当一个值应用于该键时,currentUser.name应该更新。这是用于更新值的Angular脚本:

'use strict';

angular.module("userLogin", [
  'userLogin.controllers',
]);

angular.module('userLogin.controllers', []).controller('loginCtrl', ['$scope', function(
    $scope
  ){
      $scope.users = [
      {
        name: 'Fred Jones',
        username: 'fred.jones',
      }];
      var currentUser = {};
      $scope.myFunction = function(){
         currentUser = $scope.users[0];
         console.log(currentUser.name);
      };
      $scope.myFunction();
    }]);

所以你看到我有一个名为'users'的小数组对象(目前只有一个项目)。然后,我定义了我在HTML中绑定的currentUser变量。然后,运行一个简单的函数,将currentUser.name定义为等于'Fred Jones'。

但是,运行脚本时,页面为空白。控制台为currentUser.name吐出正确的更新值,但HTML绑定不会显示Fred Jones。

我在这里做错了什么?

这是一个codepen演示:http://codepen.io/anon/pen/JoVBaE

1 个答案:

答案 0 :(得分:1)

currentUser不在范围内。它必须是$scope.currentUser =