Angular $ scope.variable undefined

时间:2014-02-16 21:37:21

标签: javascript angularjs angularjs-ng-repeat

我遇到的问题是,当使用角度函数ng-repeat时,我的$ scope.todo列表始终返回undefined。如果我定义$ scope.todo它可以很好地工作但是当我使用下面的解决方案来获取结果并将其添加到变量时我得到一个未定义的,它似乎有机会去检索正确的值

我现在添加了一些更好的代码来解释我的问题。在查看下面的一些jsfiddles并尝试这些解决方案后,我开始认为它与我的回调有关。

function TodoCtrl($scope) {

   $scope.todos = [];

   buildInitialList(function (result){
       console.log(result); //Logs defined after the undefined below
       $scope.todos = result;
   });

   console.log($scope.todos); //Logs undefined before the defined log above
}

function buildInitialList(callback){
    //Simulates call to db
    setTimeout(function (){
    callback([{text: 'item 1', done: false},
        {text: 'item 2', done: false}]);
},2000);
}

function fetch(url, callback) {
    $.getJSON(url, function (data, status) {
        callback(data);
    });
}

3 个答案:

答案 0 :(得分:2)

不应该这样:

$scope.testList = buildInitialList(function (result){
     return result;
   }

是这样的:

$scope.testList = buildInitialList( function (result){return result;} );

并且buildInitialList函数没有返回任何值。根据您的示例代码,它可能是这样的:

function buildInitialList(callback){
   var result = doWorkAndGetResult();
   callback(result);
  //missing return value...
   return result; /*maybe?*/
}

这是一个完全有效的jsfiddle演示:

http://jsfiddle.net/f9ee4/1/

答案 1 :(得分:0)

您实际上从未将结果分配给范围变量。正在调用您的回调,但回调的返回值不是分配给您的范围属性的值。

通过使用回调,我假设您在该全局函数中有某种异步调用。如果您没有异步调用,那么您应该只返回buildInitialList中的值,而不使用回调。

这是一个有效的小提琴: http://jsfiddle.net/973nW/

function MyCtrl($scope) {
    buildInitialList(function (result){
        $scope.name = result;
    });  
}

附注:使用全局函数并不是一个好主意,您可能需要考虑将您的函数放入服务中。

答案 2 :(得分:0)

把我的头发拉出来并且认为我的javascript出了问题之后,事实证明问题实际上是我在HTML中使用的ng-repeat

这就是我的html看起来像

<ul class="unstyled">
        <li ng-repeat="todo in todos">
            <input type="checkbox" ng-model="todo.done">
            <span class="done-{{todo.done}}">{{todo.text}}</span>
        </li>
</ul>

当我从一开始就定义了ToDo的列表时,这很好用,但是当我不得不去DB&amp;检索该列表结果似乎永远不会应用于原始的$ scope.todos

我不得不使用$ scope。$ apply函数来确保从数据库中检索我的值,然后将它们实际应用到$ scope

buildInitialList(function (result){
    $scope.$apply(function (){
        console.log(result);
        $scope.todos = result;
    });
});