Angular 2 * ngFür nur unterstützt 10 Elemente gleichzeitig in Inline-Vorlage hinzufügen

Question

Ich wollte bestimmte Element mehrere Zeit wiederholen, so dass ich *ngFor Direktive mit hardcoded Array wie [1,2,3,4,5,6,7,8,9,10] verwenden und das hat genial funktioniert. Ich habe erreicht, was ich tun wollte.

-Code

@Component({ 
    selector: 'my-app', 
    template: `<h1>My First Angular App</h1> 
     <div *ngFor="let item of [1,2,3,4,5,6,7,8,9,10]"> 
      {{item}}: My Element 
     </div>` 
}) 

Demo Plunkr

Aber sobald ich die Array-Größe mehr als 10 erhöht, beginne ich unten Fehler. Was wirklich nervig ist.

zone.js@0.6.25?main=browser:355 Unhandled Promise rejection: Unsupported number of argument for pure functions: 11 ; Zone: ; Task: Promise.then ; Value: Error: Unsupported number of argument for pure functions: 11(…) Error: Unsupported number of argument for pure functions: 11

Vorlage

<div *ngFor="let item of [1,2,3,4,5,6,7,8,9,10,11]"> 
    {{item}} 
</div>` 

Ich bin neugierig zu wissen, warum dieser Fehler wird, sobald Array-Größe erhöhen, um mehr als 10 passiert? Aber eine andere interessante Sache ist, wenn ich das gleiche Array in Komponente innerhalb Variable items= [1,2,3,4,5,6,7,8,9,10,11] und items in *ngFor setzen und es hat funktioniert.

Gibt es einen Grund für diesen Sonderfall? Parden Sie mich, wenn ich etwas einfach/dummes verpasse. Diese

Problem Plunkr

Answer 1

ist nur eine Einschränkung der Angular2 Templateparser Komplexität im Parser (mit Absicht) zu vermeiden. Es ist normalerweise eine gute Idee, Daten in der Komponenteninstanz trotzdem zu behalten.

https://github.com/angular/angular/blob/d972d8235458a6e65819f96ee56da059ec76321b/modules/%40angular/compiler/src/view_compiler/util.ts#L82