2014-05-18 3 views
0

분명히 여기에 나와야하는 범위 문제를 이해하지 못합니다. angularjs의 범위에 대해 꽤 많이 읽었음에도 불구하고 많은 경우에 예상대로 작동합니다.angularjs 중첩 컨트롤러가 삽입 된 서비스를받지 못했습니다.

그러나 여기 내가이 중첩 된 컨트롤러가 있습니다

MainController [can inject RepositoryService] 
--> ChallengeController [cannot successfully inject RepositoryService] 
    --> SingleChallengeController [cannot successfully inject RepositoryService] 
--> PlayerController [can inject RepositoryService] 

MainController는 app.js에 $ routeProvider 설정을 통해 인스턴스화 :

... 
    <body ng-app="myApp"> 
    <div id="m" class="section app-viewport" ng-view="" ng-keydown="keyPress($event);"></div> 
... 
: 여기

myApp.config(function ($routeProvider) { 
    $routeProvider 
    .when('/', { 
     templateUrl: 'views/main.html', 
     controller: 'MainController' 
    }) 
    .otherwise({ 
     redirectTo: '/' 
    }); 
}); 

를 그리고 앱 선언이다

다른 3 개의 컨트롤러는 다음과 같이 main.html에서 인라인으로 지정됩니다.

main.html : 작품을 주입

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

challengeControllers.controller('ChallengeController', ['$scope', function($scope, eventBusService, RepositoryService) { 
... 

이 방법 : 내가 지금처럼 '생성자'를 사용하여 이러한 컨트롤러에 서비스 ('RepositoryService')를 주입 시도하고

<div id="viewport" viewport ng-hide="isPhone && isLandscape" class="section main"> 
     <div class="container-fluid"> 
     <div main-panel-row-maximize-height class="row main-panel-row"> 
      <div class="main-panel"> 
      <div class="row"> 
       <div id="challenge-options-results" challenge-panel-init class="challenge-option-results display-visible" > 
       <section ng-controller="ChallengeController" class="challenge-container"> 
        <div class="container-fluid"> 
        <div class="row"> 
        <div ng-controller="SingleChallengeController"/> 
       </div> 
       </div> 
      </section> 
      </div> 
     </div> 
     </div> 
    </div> 
    </div> 
    <div class="display-hidden" id="controls-and-badges"> 
    <div id="readout" ng-controller='PlayerController' class="balance"> 
    <span class="readout-label balance">data</span><hr class="balance-separator"> 
     <span class="amount" ng-bind="currData">$NaN</span> 
    </div> 
... 

MainController와 PlayerController는 괜찮지 만 다른 두 가지는 아닙니다. 나는 그 의존성 주입과 관련된 논리적 인 행동을 할 나에게 보이는 것을 억제 실종 분명 아무것도

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

serviceModule.factory("RepositoryService", ['$rootScope', function ($rootScope, $http) { 

있습니까 : 여기

내가 주입 할 서비스의 생성자입니까?

도움 주셔서 대단히 감사드립니다.

+0

당신은 무엇 에러가 발생합니까? – klode

+0

오류가 없으면 모든 코드 경로가 자동으로 완료됩니다. 그러나, 나는 주입을 통해 전달 된 서비스의 객체를 볼 수 없었다 (그것은 정의되지 않았다). 아주 이상 하죠? – user3561344

답변

0

는이 같은 컨트롤러 정의를 작성해야 : 당신이 여기 배열 인수 eventBusServiceRepositoryService를 추가하는 것을 잊었다처럼

challengeControllers.controller('ChallengeController', ['$scope', 'eventBusService', 'RepositoryService', function($scope, eventBusService, RepositoryService) { 

것 같다. 당신이 생산 난독이 코드를 얻을 필요가없는 경우 그런데

, 단지 명시 적으로 명명 된 주사제 엉망하지 않고 다음과 같이 쓰기 :

challengeControllers.controller('ChallengeController', function($scope, eventBusService, RepositoryService) { 
+0

감사합니다. @artch - 다시 한 번 시도한 후 한 번에 시도했습니다. 아직도, 기쁨은 없습니다. 서비스 레퍼런스는 정의되지 않았고 컨트롤러를 사용하기 위해 컨트롤러에서 할 수있는 것이 아무것도 없었습니다. 그러나 두 번째 발언의 빠른 테스트 결과 성공했습니다 !! 얼마나 놀랍습니까?하지만 인젝터 이름을 지정하는 방법으로 문자열을 사용하지 않으면 인젝션이 예상대로 작동하고 필요에 따라 컨트롤러의 저장소 서비스에 액세스 할 수있게되었습니다. 이유는 모르지만 작동합니다. 어떤 시점에서 코드를 축소 할 수 있으면 좋을 것이므로 더 이상의 통찰력은 좋을 것입니다. 다시 한 번 감사드립니다! – user3561344

+0

RepositoryService 팩토리 정의를 변경 했습니까 (예를 들어 $ http를 잘못 입력 한 경우)? 콘솔에 오류가 있습니까? – artch

+0

변경했습니다. 이제 다음과 같이 보입니다. var repoServiceModule = angular.module ('RepositoryService', []); repoServiceModule.나는 완벽하게 작동한다. 나는 어떤 시점에서 명시 적으로 명명 된 주사제를 시도 할 것이고, 그저 그저 계속 전진하기를 원한다. (예를 들어, "RepositoryService", function ($ rootScope, $ http, $ q) { ... ) 작업 코드로 ... – user3561344

관련 문제