Angularjs 사용자 지정 지시문 ngShow가 트리거되지 않습니다

Question

제가 수정할 수없는 범위 문제가 있다고 생각합니다. 여기에 내 문제에 대한 설명이 있습니다.

지시문이 정의 된 요소에 "img"HTML 템플릿을 삽입하기 위해 "my-create-content"라는 자체 지시문을 만들고 싶습니다. 그런 다음 "img"에서 ng-show를 정의하고 ng-show를 false로 평가하는 시간 초과를 지정했지만 "img"요소가 숨겨져 있지 않습니다. ng-src = "{{imageUrl}}"이므로 스코어 문제인 경우 제대로 평가됩니다.

.directive('myCreateContent', [function() { 

function link(scope, element, attrs) { 

    scope.showImg = false; 

    function updateImg(url){ 
    scope.imageUrl = url; 
    scope.showImg = true; 
    } 

    if (scope.grid[0].image){ 
    updateImg(scope.grid[0].imageUrl); 
    setTimeout(function(){ 
     scope.showImg = false; 
    }, scope.grid[0].duration); 
    } 

} 

return { 
    scope: { 
    grid: '=' 
    }, 
    template: '<img ng-show="showImg" ng-src="{{imageUrl}}" class="grid">', 
    link: link 
}; 
}]); 

그리고 HTML :

당신은 범위 변수를 이해하는 AngularJS와 대한 $apply를 호출 할 필요가

<div my-create-content grid="grid" class="container"> 

Answer 1

이 변경

여기 내 코드입니다.

이 경우 setTimeout을 사용하는 대신 $timeout을 사용해야합니다. 그러면 모든 것이 처리됩니다.

더 여기 읽기 : 거 소화 따라서 렌더링 할 수 있다는 보장 있기 때문에 $timeout service

Answer 2

당신은, $timeout을 사용해야합니다.

AngularJS와 이미 내가 jsfiddle에 코드를 넣어

을 소화하는 경우 당신은 또한의 setTimeout 내부 $apply을 사용할 수 있지만 일부 자바 스크립트 오류를 ​​트리거 할 수 있기 때문에 최선의 선택이 아니다 :

http://jsfiddle.net/g07stzdk/3/

코드를 읽으면 회전식 작업을하고 있다고 생각합니다. 이것이 맞을 경우 올바른 함수 코드가 다음과 같습니다. $intervalsetInterval (일반 자바 스크립트)