Получить данные из ngResource, а затем привязать результат для просмотра

Question

Я работаю над проектом AngularJS. Я использую ngResource для захвата json-данных из статического файла (теперь можно использовать db).

И затем я использую контроллер для вызова службы с помощью get(). Я хотел бы привязать данные в функции обратного вызова к переменной $ scope (gridData) в контроллере. Однако он не работает и отображается как неопределенный. Какие-либо предложения? json данные довольно прямолинейны, просто используйте массив с 0-10 как идентификаторы, если вы хотите протестировать с помощью jsbin/plunker/любого онлайн-редактора.

контроллер:

'use strict'; 

var gridCtrl = appCtrl.controller('ctrl', function ($scope, dbService) { 
    $scope.gridData = []; 

    dbService.get(function (data) { 
     $scope.gridData = data; 
     console.log(data.jsondb); 
    }); 
}); 

DATASERVICE:

'use strict'; 

angular.module('app.services', ['ngResource']) 
    .factory('dbService', function ($resource) { 
     return $resource("/js/datafile/db.json"); 
}); 

Html Вид:

<div ng-controller="ctrl"> 
    <div ng-repeat="character in $scope.gridData"> 
     {{character.id}} 
    </div> 
</div> 

Answer 1

Это неправильно: <div ng-repeat="character in $scope.gridData">

Оно должно быть:

<div ng-controller="ctrl"> 
    <div ng-repeat="character in gridData"> 
     {{character.id}} 
    </div> 
</div>