Question

首先，我从这个主题找到了api地址： Laravel 4 and Angular JS and Twitter Bootstrap 3 Pagination

现在我正在努力解决这个问题，我的小脚本就是这样：

var app = angular.module('kategori', [
        'ngResource',
        'apiBaseRoute'
    ]);

    app.factory('Data', ['$resource', 'apiBaseRoute', function($resource, config){
        return $resource('http://develop.alexei.me/careers/careers.php?callback=JSON_CALLBACK&page=:page', {
            page: 1
        }, {
            'get': {
                method: 'JSONP'
            }
        });
    }]);

    app.controller('KategoriListCtrl', function($scope, Data){

        $scope.init = function() {
          Data.get({}, function(response){
              $scope.kategoriList = response.careers;


          },function(error){
              console.log("HATA VAR" + error);
          });
        };

    });

    app.directive('paginate', function(){
        return{
            scope:{ allData: '=paginate2' },
            link: function(scope){
                console.log(scope);
            }
        }
    });

这是html方面：

                <div class="col-md-6 col-md-offset-3" ng-controller="KategoriListCtrl" ng-init="init()">
                {{kategoriList}}
                <div paginate paginate2="kategoriList"></div>
            </div>

如你所见，console.log（scope）inside指令在控制台中显示了很多东西，特别是我看到allData有很多数据，但如果我把它改成

console.log(scope.allData)

打印undefined ..

我不明白为什么。我怎么能解决这个问题？感谢。

Answer 1

当JS到达您的console.log时，allData属性未定义（因为kategoriList未定义）。 kategoriList（以及allData）将在以后异步创建（并填充大量数据）。

那么，为什么在记录scope对象时会看到数据？

在记录对象时，它没有属性allData（并且没有数据）但当您转到控制台并展开节点并查找allData属性时，该属性已被AJAX调用添加并填充（使用$resource ）。

目前尚不清楚您想对allData做些什么如果你想在例如ng-repeat你不必担心：你可以正常使用它（好像已经定义了），Angular会在它到达时自动“捡起来”并做一些事情。
然而，如果您希望（出于神秘的原因）在准备就绪时获得通知，您可以使用 $watch ：

scope.$watch('allData', function(newValue) {
    if (newValue !== undefined) {
        console.log(scope.allData);
    }
});

另请参阅此 short demo 。

Angularjs：scope.data在指令中是未定义的

1 个答案: