[javascript] AngularJS에“새로 고침”을 지시하는 방법

사용자 지정 지시문의 범위를 벗어나는 click 이벤트가 있으므로 “ng-click”속성을 사용하는 대신 jQuery.click () 리스너를 사용하고 다음과 같이 범위 내에서 함수를 호출합니다.

$('html').click(function(e) {
  scope.close();
);

close ()는 다음과 같은 간단한 함수입니다.

scope.close = function() {
  scope.isOpen = false;
}

내 생각에는 다음과 같이 “ng-show”가 isOpen에 바인딩 된 요소가 있습니다.

<div ng-show="isOpen">My Div</div>

디버깅 할 때 close ()가 호출되고 isOpen이 false로 업데이트되고 있지만 AngularJS보기가 업데이트되지 않는다는 것을 알았습니다. Angular에게 수동으로 뷰를 업데이트하도록 지시 할 수있는 방법이 있습니까? 아니면 내가 보지 못한이 문제를 해결하기위한 더 “Angular”접근법이 있습니까?



답변

해결책은 전화했다 …

$scope.$apply();

… 내 jQuery 이벤트 콜백에서.


답변

왜 전화 $apply해야합니까?

TL; DR :
Angular 외부 에서 $apply변경 한 내용을 적용 할 때마다 호출해야합니다 .


@Dustin의 답변 을 업데이트하기 위해 $ apply가 정확히 무엇을 하고 작동 하는지에 대한 설명이 있습니다.

$apply()AngularJS 프레임 워크 외부에서 AngularJS의 표현식을 실행하는 데 사용됩니다. (예 : 브라우저 DOM 이벤트, setTimeout, XHR 또는 타사 라이브러리). 우리는 AngularJS 프레임 워크를 호출하기 때문에 예외 처리 , 감시 실행 의 적절한 범위 수명주기를 수행해야합니다
.

각도를 사용하면 모든 값을 바인딩 대상으로 사용할 수 있습니다. 그런 다음 JavaScript 코드 회전이 끝나면 값이 변경되었는지 확인합니다. 바인딩 값이 변경되었는지 확인하는 단계에는 실제로 $scope.$digest()1 메소드가 있습니다. 우리는 $scope.$apply()대신 (을 호출 할 $scope.$digest) 대신 직접 호출하지 않습니다 .

Angular는 표현식에 사용 된 변수와 $watch범위 내 생활 내부의 모든 항목 만 모니터링합니다 . 따라서 Angular 컨텍스트 외부에서 모델을 변경하는 경우 $scope.$apply()해당 변경 사항을 전파해야합니다. 그렇지 않으면 Angular는 변경 사항을 알지 못하므로 바인딩이 업데이트되지 않습니다 2 .


답변

사용하다

$route.reload();

$route컨트롤러 에 주입 하십시오.


답변