식을 '워치 해제'하는 방법

식을 '워치 해제'하는 방법

예를 들어 배열이 큰 NG 반복이 있다고 칩시다.

ng-repeat 실행 시 어레이의 모든 요소가 격리된 범위에 추가되며 어레이 자체도 범위에 포함됩니다.즉, $digest는 어레이 전체의 변경을 체크하고, 게다가 어레이 내의 모든 개별 요소의 변경을 체크합니다.

이 플런커를 예로 들어주세요.

제 사용 사례에서는 어레이의 요소를 전혀 변경하지 않기 때문에 감시할 필요가 없습니다.어레이 전체를 변경할 경우 ng-repeat은 테이블 전체를 다시 렌더링합니다.(제가 틀렸다면 알려주세요.)

(예를 들어) 1000개의 행 배열에서 평가할 필요가 없는 1000개의 식입니다.

메인 어레이를 보면서 워처로부터 각 요소의 등록을 해제하려면 어떻게 해야 합니까?

등록 해제 대신 $digest를 좀 더 제어하고 각 행을 생략할 수 있을까요?

이 구체적인 사례는 사실 더 일반적인 문제의 한 예입니다.$watch가 '등록 해제' 기능을 반환하는 것은 알지만, 대부분의 경우 디렉티브가 시계를 등록하고 있을 때는 도움이 되지 않습니다.

모든 아이템을 보기 위해 시청하지 않는 큰 배열의 리피터가 있는 것.

하나의 인수와 식을 어레이에 할당하는 커스텀 디렉티브를 작성해야 합니다.그리고 링크 함수에서는 그 어레이를 감시하기만 하면 링크 함수가 HTML을 프로그래밍 방식으로 갱신할 수 있습니다(ng-repeat을 사용하는 대신).

(psuedo 코드):

app.directive('leanRepeat', function() {
    return {
        restrict: 'E',
        scope: {
           'data' : '='
        },
        link: function(scope, elem, attr) {
           scope.$watch('data', function(value) {
              elem.empty(); //assuming jquery here.
              angular.forEach(scope.data, function(d) {
                  //write it however you're going to write it out here.
                  elem.append('<div>' + d + '</div>');
              });
           });
        }
    };
});

...그건 골칫거리인 것 같아요.

대체 해킹 방법

루프를 통과해서$scope.$$watchers검사하다$scope.$$watchers[0].exp.exp삭제할 표현식과 일치하는지 확인한 다음 간단한 방법으로 제거합니다.splice()여기 PITA는 이런 것들이Blah {{whatever}} Blahbetween 태그는 표현식이며 캐리지 리턴도 포함됩니다.

위에서는 ng-repeat의 $scope를 루프하여 모든 것을 제거하고 원하는 시계를 명시적으로 추가할 수 있습니다.몰라.

어느 쪽이든 해킹으로 보입니다.

$scope에서 만든 워처를 제거합니다.$watch

할 수 .$watch에 $watch 삭제:

예를 들어 다음과 같이 합니다.$watch: once only only only only only only:

var unregister = $scope.$watch('whatever', function(){ 
     alert('once!');
     unregister();
});

물론 언제든지 등록 취소 함수를 호출할 수 있습니다.그건 그냥 예에 불과해요.

결론:당신이 원하는 것을 정확히 할 수 있는 좋은 방법은 없어요.

그러나 고려해야 할 한 가지 사항은 다음과 같습니다.걱정할 만한 가치가 있는 일인가?게다가 수천 개의 레코드를 각각 수십 개의 DOMElements에 로드하는 것은 정말로 좋은 생각일까요?생각할 거리.

---

EDIT 2(불량한 아이디어 제거)

$watch는 호출 시 $watch를 언바인드하는 함수를 반환합니다.'watch Once'에는 이 정도만 있으면 됩니다.

var unwatchValue = scope.$watch('value', function(newValue, oldValue) {
  // Do your thing
  unwatchValue();
});

편집: 제가 올린 다른 답변을 참조하십시오.

나는 Blesh의 아이디어를 분리할 수 있는 방법으로 실행해 왔다. ★★★ngOnce는, 「」를 합니다.ngRepeat가 각 항목에 생성됩니다.부모님으로부터 것을 합니다.scope.$digest시시들은은 절절절절절절않

JSFiddle의 소스 및 예시

지시문 자체:

angular.module('transclude', [])
 .directive('ngOnce', ['$timeout', function($timeout){
    return {
      restrict: 'EA',
      priority: 500,
      transclude: true,
      template: '<div ng-transclude></div>',
        compile: function (tElement, tAttrs, transclude) {
            return function postLink(scope, iElement, iAttrs, controller) {
                $timeout(scope.$destroy.bind(scope), 0);
            }
        }
    };
}]);

사용방법:

      <li ng-repeat="item in contents" ng-once>
          {{item.title}}: {{item.text}}
      </li>

★★★ ng-once독자적인 범위를 만들지 않기 때문에 형제 요소에 영향을 줄 수 있습니다.이러한 기능은 모두 동일합니다.

  <li ng-repeat="item in contents" ng-once>
      {{item.title}}: {{item.text}}
  </li>
  <li ng-repeat="item in contents">
      <ng-once>
          {{item.title}}: {{item.text}}
      </ng-once>
  </li>
  <li ng-repeat="item in contents">
      {{item.title}}: {{item.text}} <ng-once></ng-once>
  </li>

메모 이것은 좋지 않은 생각일 수 있다

해서 '어울리지 않다'를 수 요.bindonce를 지정합니다.ng-repeathttps://github.com/pasvaz/bindonce 에서 다운로드해야 합니다.

편집: 몇 가지 주의사항:

★★★★★★★★★를 사용하고 있는 경우는{{}}은 '', '보간', '보간', '보간', '보간', '보간'으로 바꿔야 합니다.<span bo-text>.

★★★★★★★★★를 사용하고 있는 경우는ng-의 지시어로 .bo-이치노

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★.bindonce ★★★★★★★★★★★★★★★★★」ng-repeat에서 '어느 인가', '어느 쪽이든', '어느 쪽이든'을.bindonce부모 요소(https://github.com/Pasvaz/bindonce/issues/25#issuecomment-25457970 참조) 또는 추가track byyour ng-repeat.

「 」를 사용하고 angularjs 1.3단일 구문을 할 수 .

<li ng-repeat="item in ::contents">{{item}}</li>

첫이 "Digest Cycle"에서 됩니다.undefined로로 합니다.defined처음으로.

이에 대한 매우 유용한 블로그입니다.

언급URL : https://stackoverflow.com/questions/13651578/how-to-unwatch-an-expression