AngularJS 팩토리로 json 데이터로드

Question

컨트롤러에 엄청난 json 오브젝트가있어 별도의 파일로 나가고 싶습니다. 지금까지 나는이 일을 해요 : 유래에 here 설명으로

myApp.controller('smController', ['$scope', function($scope) { 
    ... 
    var stadtmobilRates = { 
    classic: { 
     A: { 
     night: 0, 
     hour: 1.4, 
     day: 21, 
     week: 125, 
     km000: 0.2, 
     km101: 0.18, 
     km701: 0.18 
     }, 
     ... 
    } 
    }; 

나는 공장과 약속을 사용하고 있습니다 :

myApp.factory('stadtMobilRates', function($http) { 
    var promise = null; 

    return function() { 
    if (promise) { 
     // If we've already asked for this data once, 
     // return the promise that already exists. 
     return promise; 
    } else { 
     promise = $http.get('stadtmobilRates.json'); 
     return promise; 
    } 
    }; 
}); 

myApp.controller('smController', ['$scope', function($scope, stadtMobilRates) { 
    var stadtmobilRates = null; 
    stadtMobilRates().success(function(data) { 
    stadtmobilRates = data; 
    }); 

지금 나는 stadtMobilRates().success(function(data) {에서 TypeError: undefined is not a function 받고 있어요 선. 컨트롤러에 주입 했는데도 stadtMobilRates 팩토리가 허용되지 않는 이유는 무엇입니까?

편집 # 1 : 나는 새우가 제안한대로 공장 이름을 배열에 추가했습니다.

myApp.controller('smController', ['$scope', 'stadtMobilRates', function($scope, stadtMobilRates) { 
    var stadtmobilRates = null; 
    stadtMobilRates().success(function(data) { 
    stadtmobilRates = data; 
    }); 

    console.log(stadtmobilRates); 

그러나 stadtmobilRates null입니까?

편집 # 2 : Plunker에 내 앱의 단순화 된 버전을 만들었습니다. 잘 작동합니다. 전체 앱에서 나는 이 여전히 null 인 다른 경로로 작업하고 있습니다. 경로가있는 전체 앱의 플 런커를 만들 수 없습니다. 여기 GitHub에 대한 전체 코드가 있습니다. 위의 코드는 Line 159입니다. 나는 그것이 내 길과 관련이 있다고 생각하니?

Answer 1

배열의 팩토리 이름을 전달하는 것을 잊었습니다. 일반적으로 문자열의 목록과 함수 자체가 요소로 구성된 배열을 전달합니다. 배열을 함수 선언의 매개 변수와 동기화 상태로 유지하십시오. 이 방법은 인젝터가 어떤 서비스를 기능에 주입 할 것인지를 안다.

myApp.controller('smController', ['$scope', 'stadtMobilRates', function($scope, stadtMobilRates) { 

편집

이것은 내가 그것을 얼마나 ... 루트는 내가 데이터를 한 번에로드되는 저장되어 있으므로 resolve를 사용하려면 사용하는 경우입니다. 그래서 $routeProvider에서, 나는 ... 다음에

when('/sm', { 
     templateUrl: 'partials/sm.html', 
     controller: 'smController', 
     resolve:{ 
       load:function(stadtMobilRates){ 
        return stadtMobilRates.LoadData(); 
      } 
    }). 

을하여 smController 부분을 바꿀 것 또한이 경로가로드되기 전에, 전화를 겁니다 공장 그래서

myApp.factory('stadtMobilRates', function ($q, $http) { 
var mobilRates = null; 

function LoadData() { 
    var defer = $q.defer(); 
    $http.get('stadtmobilRates.json').success(function (data) { 
     mobilRates = data; 
     defer.resolve(); 
    }); 
    return defer.promise; 
} 

return { 
    GetData: function() { return mobilRates ; }, 
    LoadData:LoadData 
} 
}); 

을 수정 한 공장에서 LoadData 기능입니다. 데이터가로드되면 약속을 해결하므로이 LoadData 함수는 한 번만 호출됩니다. 일단 약속이 해결되면, 그것은 앞으로 나아가고보기를로드 할 것입니다. 컨트롤러에 이제

, 당신은 데이터를 얻을 할 때마다, 당신이 할 일은 GetData

myApp.controller('smController', ['$scope', 'stadtMobilRates', function($scope, stadtMobilRates) 
{ 
    var stadtmobilRates = stadtMobilRates.GetData(); 
});