2014-12-10 4 views
-1

내 코드의 단순화 된 버전

컨트롤러 :

module.controller('myCtrl', function($scope, myService){ 
    $scope.isToggleActive = false; 
    $scope.toggle = function() { 
     $scope.isToggleActive = !$scope.isToggleActive; 
    }; 
    myService.getData().then(function(data){ 
     $scope.number = data.number 
     $scope.items = data.items; 
    }); 
}); 

서비스 :

module.factory('myService', function(JsonService, $q){ 
    function getData() { 
     var deferred = $q.defer(); 
     JSONService.getJSON(url) 
      .success(function(data) { deferred.resolve({number: data.number, items: data.items}); }) 
      .error(function(data) { deferred.reject(data); }); 
     return deferred.promise; 
}); 

HTML은 :

<h1>{{number}}</h1> 
<div id="tglbtn" ng-click="toggle()"></div> 
<div id="toggle" ng-show="isToggleActive"> 
<span ng-repeat="item in items">{{item.text}}</span> 

jsonservice는 사용하는 $ HTTP에서 데이터를 얻을 수 있습니다 휴식 서비스.

내 코드에서 myService.getData() ... 행을 흥미롭게도 해당 제목이 적용되지만 기대되는 다중 스팬 항목 대신 ng- 반복하면 toggle-div가 표시되고 tglbtn을 클릭해도 표시 여부가 전환되지 않습니다.

콜백에 중단 점을 설정할 때 $ scope.number와 $ scope.items에 예상 값이 있습니다. 그래서 나는 $ apply 나 $ digest가 없다고 생각했다. 그렇게하면 이미 진행중인 다이제스트가 있다는 오류가 발생합니다.

myService.getData() ... 행을 제거하면 toggle-div가 표시되지 않고 토글 클릭이 작동합니다.

내가 콘솔 :(어떤 도움

덕분에 더 경고 또는 오류를 얻을!

+2

'getData '란 무엇입니까? 'getMatchListEdition'입니까? 나는 당신의 코드에서 그것을 보지 않는다 : 나는 무엇인가 놓치고 있는가? – pasine

+0

죄송합니다. 서비스의 기능 이름을 업데이트했습니다. –

답변

0

컨트롤러 먼저 몇 가지 기본 값으로 수를 설정하십시오.

$scope.number = 0 

그렇지 않으면 뷰가 생성되어 에러가 발생하면 변수를 사용할 수 없습니다. 코드에서 $ scope.number는 $ http 호출로부터의 약속이 해결 된 후에 만 ​​존재합니다. 항목과 동일합니다.

콘솔에 오류가 표시되지 않는다는 것은 이상한 일입니다. 엄격 모드 사용 ('엄격한 사용')?

관련 문제