2014-01-24 8 views
3

각도 다트 튜토리얼의 주 실행 예는 레시피 북 앱입니다. Chapter 5 on filters and services의 끝 부분에있는 연습은 ""조리법에있는 [각 성분 목록의] 모든 양을 곱하는 [custom] 필터를 작성하여 " 사용자가 두 배, 세 배 또는 네 배로 확대 할 수있게하려는 것입니다. 조리법. " 예 : "1/2 컵의 밀가루"의 성분은 두 배가되면 "밀가루 한 컵"이됩니다.AngularDart 맞춤 필터 호출() 메소드가 멱등수 일 필요가 있습니까?

나는 그런 사용자 정의 필터를 작성했습니다 : 그것은 (A quantitydescription 구성) Ingredient의 목록을 받아 (증가 수량으로) 새로운 Ingredient s의 새 목록을 반환하지만 나는 다음과 같은 오류를 얻고있다 :

5 $digest() iterations reached. Aborting! 

내 질문은 : AngularDart 사용자 정의 필터 call() 방법의 요구 및/또는 허용 된 행동은 무엇인가 ? 예를 들어 입력 목록에서 요소를 제거 (즉, 필터링) 할 수 있지만 요소를 새로 추가하거나 대체 할 수 있습니까? 다트 angular.core NgFilter 설명서는 단순히 "필터는 호출 메소드가있는 클래스입니다"라고 말합니다. 나는 세부 사항을 더 발견하지 못했다.

this AngularJS post에 대한 응답에서 외삽하면 call()을 반복적으로 호출하면 결과적으로 "같은 결과가 나타납니다". 그렇다면 이것은 합리적인 제약이 될 것입니다. 항복

"동일한 결과가"하지 identical() (오브젝트 식별자) 이럴 call() 요구 멱등 될 것을 의미 할 수 있지만, 다트 등 멱등의 경우 == (객체 당량)를 기준으로해야한다. 나는 문제를 설명하기 위해 다음과 같은 작은 예제를 사용하여 몇 가지 테스트를 실행 : 경우

  • main.dart
import 'package:angular/angular.dart'; 

    class A { } 

    @NgFilter(name:'myFilter') class MutatingCustomFilter { 
     final A _a = new A(); 
     call(List list) => new List.from(list)..add(_a); // runs ok. 
     // call(List list) => new List.from(list)..add(new A()); // gives error 
    } 

    class MyAppModule extends Module { 
     MyAppModule() { type(MutatingCustomFilter); } 
    } 

    main() => ngBootstrap(module: new MyAppModule()); 
  • index.html을 발췌
<ul> 
     <li ng-repeat="x in [1,2,3] | myFilter">{{x}}</li> 
    </ul> 

를 I class A의 본문을

로 변경하십시오. == 간주 A 모든 인스턴스 main.dart (add(new A())으로 하나)의 다음에 call() 번째 구현한다 451,515,
@override bool operator==(other) => true; 
@override int get hashCode => 1; 

여전히 에러 (비록 다른 하나)을 제공한다.

사용자 지정 필터를 사용하지 않고 튜토리얼 연습 문제를 해결하는 방법을 알 수 있지만 요청한대로 작동하는 필터를 찾는 것을 포기하지 않으려 고합니다. 저는 Angular를 처음 사용하고 AngularDart로 뛰어 들기로했습니다. 따라서 call()의 다양한 효과를 설명하거나 call()의 예상되는 동작에 대한 문서를 찾는 데 도움이됩니다 (또는 사용자 정의 필터 단순히 작성할 수 없습니다!) 감사하겠습니다.

답변

5

너무 많은 반복

각 모델의 변화를 검출하고, 그 반응 함수를 실행한다. 반응 함수는 모델을 더 변경할 수 있습니다. 이것은 모델이 모순 된 상태로 남을 것입니다. 이러한 이유로 우리는 변경 감지를 다시 실행하여 더 많은 변경 사항을 생성 할 수 있습니다. 이러한 이유로 우리는 모델이 안정화 될 때까지 변경 사항을 다시 실행합니다. 그러나 포기하기 전에 변경 탐지를 몇 번이나 다시해야합니까? 기본적으로 5 번입니다. 모델이 5 반복 후에 안정화되지 않으면 우리는 포기합니다. 이것은 귀하의 경우에 진행됩니다.

변경 감지

개체가 변경되었을 때? 하나는 identical 또는 == (같음)을 사용할 수 있습니다. 각각에 대해 좋은 논증을 제기 할 수 있지만, 빠르고 일관성이 있으므로 identical을 사용하기로 결정했습니다. == (같음)을 사용하는 것은 까다로 우며 변경 감지 알고리즘에 부정적인 영향을줍니다.

필터 및 배열

한는 어레이를 동작하는 필터, 그 어레이의 새로운 인스턴스를 생성 할 수밖에 없다 실행

. 이것은 똑같지 만 다행스럽게도 어레이 탐지가 아닌 어레이 내용 감지를 위해 자체 알고리즘을 사용하는 ng-repeat에 입력됩니다. 배열은 실행 사이에 동일 할 필요는 없지만 그 내용은 동일해야합니다. 그렇지 않으면 ng-repeat은 삽입과 변경 사이의 차이를 알 수 없으므로 적절한 애니메이션을 수행해야합니다.

귀하의 코드 필터와

문제는 다이제스트 루프의 각 반복에 새로운 인스턴스를 생성한다는 것이다. 이러한 새로운 인스턴스는 모델이 안정화되지 못하게하여 오류를 예방합니다. (이이 문제를 해결하기 위해 계획이지만, 우리가 거기 도착하기 전에 그것은 몇 주 될 것입니다.) 귀하의 솔루션은 전체 배열을 소비하는 필터를 만들려고

해결 한 다음 새를 만들려고 시도 배열, ng-repeat. 다른 (선호하는) 해결책은 ng-repeat 반복을 그대로두고 qty를 만드는 바인딩에 필터를 적용하고 거기에 적용하는 것입니다.

<span>{{recipe.qty | myFilter:multiply}}</span> 

+0

자세한 답변을 주셔서 감사합니다. Misko. "이 문제를 해결할 계획"에 대해 더 많이 배우기를 고대하고 있습니다. –

+0

귀하의 의견에 따라 제안 된 솔루션은'myFilter'가 멱등 원일 경우에만 작동합니다. 동일한 (또는 더 정확하게, 5 번의 반복 안에서 수렴 됨). 이것은'num'의 경우 인 것 같습니다. 성분 'quantity'의 타입이 특수한 숫자 클래스 인 구현 인 경우, 'Rational'은 '1 1/3'과 같은 숫자의 정수 처리를 지원합니다 (예 : 1/1 3 컵의 밀가루). 이러한 필터 기반 솔루션은 여전히 ​​작동하지 않을 것입니다 (실습 모듈 방식). 아니면 무언가를 놓치고 있습니까? –

+0

"이 문제를 해결할 계획"이 실행될 때까지 파이프 성분 값을 (사용자 정의) 'toString' 필터. –