2

나는 다음과 같은 지침을을 격리 할 것. 하지만 지금 templateUrl (현재 주석 처리 된 상태)로 전환하면 작동하지 않습니다. 이 문제를 표시하기 위해 simple Plunker을 생성했습니다. sort와 bsorter 지시어를 비교하면 템플릿 대신 templateUrl을 사용할 때 컴파일 된 요소에 대한 isolateScope() 호출이 중단 된 것처럼 보입니다. 어떤 아이디어?AngularJS와 templateUrl 템플릿 대 범위

답변

1

그것은 이상한 일입니다. 저는 이것이 실제로 templateUrl을 사용하는 경우 격리 된 범위를 얻지 못하는 버그라고 생각합니다. 템플릿 자체가 올바르게로드되었지만 범위가로드되지 않습니다. 일부 추가 로깅을 사용하여 updated the plnkr을 체크 아웃했습니다. 콘솔을 체크 아웃하면 의미가 표시됩니다. bsorter은 ng-isolate-scope 클래스를 얻지 못하고 범위가 정의되지 않은 것으로 반환됩니다.

편집 : 나는 컴파일 함수가 호출 될 때 콘솔 메시지를 기록하는 plnkr 추가로 업데이트되었습니다

. 이것은 javascript/angularJS 지식의 한계입니다. 그러나 이전에 이라는 분류기 컴파일 함수와 달리 이후에 스코어를 반환해야하는 경우에는 bsorter 컴파일 함수가 뒤에 기록됩니다.

+0

편집 내용이 정말 유용합니다. 나는 [plnkr] (http://plnkr.co/edit/EjFYFmcHS0uO3QXiN8KJ?p=preview)을 더 업데이트했으며 이제는 작동합니다. 나는 꽤 좋지 않은 $ timeout을 사용했다. 그것은 나에게 마치 templateUrl Angular가 주소를 가져 오려고 시도하는 것처럼 보입니다. 주소가 실패하면 캐시를 사용합니다. 그러나 HTTP 요청은 실패하는 데 시간이 걸립니다. – Deiwin

+0

그 여분의 정보로 인터넷 검색을하면 Angular가 DOM을 수정 한 시점을 알 수없는 것이 일반적인 문제인 것으로 보입니다. 또한 $ timeout 또는 $ evalAsync를 사용하는 것이이 문제를 해결하는 두 가지 가장 일반적인 방법 인 것으로 보입니다. 나는 이것이 지금 할 것 같아요. – Deiwin

+0

테스트 할 때 확실한 잡았다. 후속 조치에 감사 드리며, $ timeout 해결 방법은 유용한 트릭입니다. – morloch

0

beforeEach()가 아니라 it() 함수에서 isolateScope()를 호출해야합니다.

describe("Testing...", function(){ 
    var element, isoScope; 

    beforeEach(function(){ 
     module("myApp"); 

     inject(function($rootScope, $compile){ 
      var scope = $rootScope.$new(); 
      element = $compile(angular.element("<sorter></sorter>"))(scope); 
      // isoScope = element.isolateScope(); <- Move from here 
      $rootScope.$digest(); 
     }); 
    }); 

    it("something...", function(){ 
     isoScope = element.isolateScope(); // <- to here 
     expect(isoScope.someProp).toBe("someValue"); 
    }); 
}); 
0

당신은 $ rootScope를 호출해야합니다. $ 다이제스트() $를 통해 지시 컴파일을 생성 한 후, 다음 작동합니다 (이다와 함께 지금 당신은 당신의 변수 parentScope에서의 $ 다이제스트()를 호출하고 $ rootScope. $ new()로 작성된 새 범위