AngularJS新的路由器不能實例化控制器

我想創建我的整個角度的應用程序，使用$http在從以.json文件提取數據使用服務。這是工廠的樣子：AngularJS新的路由器不能實例化控制器

var trooNewsServices = angular.module('trooNewsServices', []); 

trooNewsServices.factory('Articles', ['$http', 
    function($http){ 
    $http.get('resources/articles.json').success(function(data) { 
      return data; 
    }); 
    }]);

我將trooNewsServices依賴項傳入我的模塊聲明中。任何控制器，我嘗試在我的新Articles服務傳遞，我得到一個

「無法實例化控制器的HomeController」

錯誤在控制檯中。不知道我錯過了什麼/這個代碼有什麼問題。我應該使用$resource而不是$http嗎？

這裏是我想過去的「trooNewsServices」到我的主要模塊：

var TrooNews = angular 
    .module('TrooNews', ['ngMaterial', 'ngNewRouter', 'trooNewsServices']) 
    .config(function($mdThemingProvider) { 
     $mdThemingProvider 
      .theme('default') 
      .primaryPalette('indigo') 
      .accentPalette('pink'); 
    }) 
    .config(function($locationProvider) { 
     $locationProvider.html5Mode({ 
      enabled: false, 
      requireBase: false 
     }); 
    });

這裏是我嘗試注入「文章」到我的控制器之一：

TrooNews.controller('HomeController', ['Articles', 
    function(Articles) { 
     this.name = 'Troo News'; 
     this.articles = Articles.query(); 
    }]);

而且這裏是我如何在我的'AppController'中設置路由：

TrooNews.controller('AppController', function($router, $mdSidenav, $mdToast, $parse, $http) { 
    $router.config([{ 
     path: '/', 
     component: 'home' 
    }, { 
     path: '/home', 
     component: 'home' 
    }, { 
     path: '/about', 
     component: 'about' 
    }, { 
     path: '/settings', 
     component: 'settings' 
    }, { 
     path: '/article/:id', 
     component: 'article' 
    }]); 

    this.toggleSidenav = function(menuId) { 
     $mdSidenav(menuId).toggle(); 
    }; 

    this.navigateTo = function(link) { 
     var parts = link.match(/^(.+?)(?:\((.*)\))?$/); 
     var url; 
     if (parts[2]) { 
      url = '.' + $router.generate(parts[1], $parse(parts[2])()); 
     } else { 
      url = '.' + $router.generate(parts[1]); 
     } 

     $mdToast.show($mdToast.simple().content('Navigate To: ' + url).position('bottom right')); 
     $router.navigate(url); 
     this.toggleSidenav('left'); 
    }; 
});

來源

2016-02-12 Jess Anastasio

你能告訴你如何傳遞服務控制器？ – tymeJV

@tymeJV - 更新顯示！ –

@FuzzyTree我將.success改爲.then，並得到相同的確切錯誤 –

在您的HomeController，則執行this.articles = Articles.query();，但你的Articles服務不定義任何query功能。

相反，你的服務僅僅是立即執行在創建一個HTTP GET請求。不知道爲什麼這會導致你的錯誤，但它是一個紅旗。

試着改變你的Articles服務於以下內容：

trooNewsServices.factory('Articles', ['$http', 
    function Articles($http){ 
    this.query = function() { 
     return $http.get('resources/articles.json') 
     .then(function(response) { return response.data; }); 
    }; 
}]);

來源

2016-02-12 19:32:54

這是有道理的。但是，在將我的Articles服務更改爲此後，我仍然得到「無法實例化控制器HomeController」（這也會在使用Articles但不使用查詢的其他控制器中引發），並且該錯誤與router.es5 .js文件 - 所以也許有一些錯誤的路由與服務注入混亂？ –