TypeError：无法读取未定义的属性'getGames'

Question

我是新来的angularjs，我有这个问题似乎无法弄清楚。

我拉了一个JSON饲料因为某种原因，应用程序返回undefined。不知道是否因为它需要一点点才能得到json feed或者我的代码有问题。

我不断收到这

TypeError: Cannot read property 'getGames' of undefined 

在这里的错误是角的JavaScript我写。

angular.module('games', ['ui.router']) 
.config(function($urlRouterProvider, $locationProvider, $stateProvider) { 
    // For any unmatched url, redirect to /state1 
    $urlRouterProvider.otherwise("/"); 
    //take out # 
    $locationProvider.html5Mode({ 
     enabled: true, 
     requireBase: false 
    }); 

    // Now set up the states 
    $stateProvider 
     .state('games', { 
      url: "/", 
      templateUrl: "/static/app/list.html", 
      controller: 'gamesCtrl' 
     }) 
}) 

.controller('gamesCtrl', ['$scope', function($scope, $state, gamesFactory){ 
    $scope.$state = $state; 
    $scope.games = null; 
    function init() { 
     gamesFactory.getGames().success(function(games) { 
      $scope.games = games; 
      console.log($scope.games.data) 
     }); 

    } 
    init(); 
}]) 

.factory('gamesFactory', function($http) { 
    var factory = {}; 
    factory.getGames = function() { 
     return $http.get('/games.json'); 
    }; 
    return factory; 
}); 

JSON的输出看起来像这样

{ 
    "data": [ 
    { 
     "author": "ZeptoLab", 
     "categories": [ 
     "Classics", 
     "Puzzles" 
     ], 
     "category": "Classics", 
     "creation": "2015-05-12T09:16:57.719Z", 
     "desc_de": null, 
     "desc_en": null, 
     "desc_es": null, 
     "desc_fr": null, 
     "desc_it": null, 
     "description": "Cut the rope to feed candy to Om Nom! A mysterious package has arrived, and the little monster inside has only one request? CANDY! Collect gold stars, discover hidden prizes and unlock exciting new levels in this addictively fun, award-winning, physics-based game!", 
     "featured": false, 
     "height": 576, 
     "hwcontrols": true, 
     "id": "40071", 
     "lastUpdate": "2015-09-01T09:44:42.240Z", 
     "orientation": "landscape", 
     "responsive": true, 
     "rkScore": 1000, 
     "thumbnailUrl": "https://az680633.vo.msecnd.net/thumbnail/40071/250/40071.png", 
     "thumbnailUrl100": "https://az680633.vo.msecnd.net/thumbnail/40071/100/40071.png", 
     "title": "Cut The Rope", 
     "touch": true, 
     "url": "http://games.gamepix.com/play/40071?sid=40161", 
     "width": 1024 
    }, 
    { 
     "author": "ZeptoLab", 
     "categories": [ 
     "Adventure", 
     "Classics", 
     "Puzzles" 
     ], 
     "category": "Adventure", 
     "creation": "2015-05-19T12:09:42.672Z", 
     "desc_de": null, 
     "desc_en": null, 
     "desc_es": null, 
     "desc_fr": null, 
     "desc_it": null, 
     "description": "Join Om Nom as he travels back in time to feed his ancestors with candy. Cut the Rope: Time Travel is a completely new adventure filled with time-traveling, candy-crunching, physics-based action!", 
     "featured": true, 
     "height": 576, 
     "hwcontrols": true, 
     "id": "40072", 
     "lastUpdate": "2015-09-01T09:44:10.256Z", 
     "orientation": "landscape", 
     "responsive": true, 
     "rkScore": 999, 
     "thumbnailUrl": "https://az680633.vo.msecnd.net/thumbnail/40072/250/40072.png", 
     "thumbnailUrl100": "https://az680633.vo.msecnd.net/thumbnail/40072/100/40072.png", 
     "title": "Cut The Rope: Time Travel", 
     "touch": true, 
     "url": "http://games.gamepix.com/play/40072?sid=40161", 
     "width": 1024 
    } 
} 

任何帮助，将不胜感激

Answer 1

You can use either direct dependency injection or named dependency injection (with the array).

我会建议命名语法为minimifier如丑化将压缩变量的名称。你会得到语法错误，因为它将参数重命名为a,b等等。对于数组，您命名要注入的对象，然后使用它（最后一个参数，该函数），因此角将仍然知道您想要的对象变量压缩。

Check the injection syntax:

.controller('gamesCtrl', ['$scope', '$state', 'gamesFactory', 
    function($scope, $state, gamesFactory) { 
    $scope.$state = $state; 
    $scope.games = null; 

    function init() { 
     gamesFactory.getGames().success(function(games) { 
     $scope.games = games; 
     console.log($scope.games.data) 
     }); 

    } 
    init(); 
    } 
]);