Rekursive Vorlage mit ng-include und onload, die nichts rendern

Ich versuche, eine rekursive Vorlage in AngularJS zu erstellen. Ich habe ziemlich viele Blogposts und SO-Posts gelesen, kann aber meinen Code nicht zum Laufen bringen.Rekursive Vorlage mit ng-include und onload, die nichts rendern

Ich versuche, eine rekursive Vorlage zu machen, um einfache verschachtelte Ausdrücke mit Variablen und Operatoren zu rendern. In diesem Fall können die Knoten in der Datenstruktur einer von mehreren Typen sein und jeder Typ wird anders gerendert. Ich versuche, dies mit einer Angular-Vorlage zu lösen, ng-switch und ng-include.

Die Vorlage:

<script type="text/ng-template" id="expression.tpl"> 
    <ng-switch on="expression.type"> 
     <span ng-switch-when="two-sided-operator"> 
      <ng-include src="'expression.tpl'" ng-init="expression = expression.left"></ng-include> 
      {{ expression.operator }} 
      <ng-include src="'expression.tpl'" ng-init="expression = expression.right"></ng-include> 
     </span> 
     <span ng-switch-when="variable"> {{ expression.name }} </span> 
     <span ng-switch-when="literal"> &quot;{{ expression.value }}&quot;</span> 
    </ng-switch> 
</script> 

<ng-include src="'expression.tpl'" onload="expression=testExpression"></ng-include>

Die Daten:

$scope.testExpression = { 
    type: "two-sided-operator", 
    left: { 
     type: "variable", 
     name: "foo" 
    }, 
    operator: "==", 
    right: { 
     type: "literal", 
     value: "bar" 
    } 
};

Dies aber macht nichts. Wenn ich das interne ng-include s entferne, macht es mindestens expression.operator.

Kann mir jemand sagen, was ich falsch mache? Könnte es ein Problem mit der Zuweisung an expression in der ng-init Anweisung geben?

Danke fürs Lesen so weit!

Quelle

2016-05-05 DuXati

Dieser [Beitrag] (http://stackoverflow.com/questions/11412410/angularjs -dosing-scope-wenn-using-ng-include) kann helfen. –

Danke Rob. Ich hatte diesen Post schon gesehen, aber keine Antwort erhalten. Die Tatsache, dass "ng-include" einen neuen Bereich erzeugt, ist genau das, was ich will, nein? Auf diese Weise überschreibt 'ng-init =" expression = expression.right "' den ursprünglichen 'Ausdruck' nicht, oder? – DuXati

Es scheint etwas mit den Bereichen fischig zu sein. Der Code gibt zumindest etwas aus, wenn 'onload = "expression = $ parent.expression.left" 'verwendet wird, aber nun geben beide' ng-include's im ersten 'switch' das gleiche Ergebnis (zweimal" bar "). Es scheint also, dass 'onload' einmal für die beiden 'ng-include's ausgeführt wird. – DuXati

Schließlich hat dies mit einem Hack von ng-repeat zu arbeiten. Die Arbeitsvorlage:

<script type="text/ng-template" id="expression.tpl"> 
    <ng-switch on="expression.type"> 
     <span ng-switch-when="two-sided-operator"> 
      <span ng-repeat="expression in [expression.left]" ng-include="'expression.tpl'"></span> 
      {{ expression.operator }} 
      <span ng-repeat="expression in [expression.right]" ng-include="'expression.tpl'"></span> 
     </span> 
     <span ng-switch-when="variable"> {{ expression.name }} </span> 
     <span ng-switch-when="literal"> &quot;{{ expression.value }}&quot;</span> 
    </ng-switch> 
</script>

Ich verstehe ng-include tief genug nicht zu erklären, warum es nicht funktionierte, obwohl :)

Quelle

2016-05-09 05:57:07 DuXati

Rekursive Vorlage mit ng-include und onload, die nichts rendern

Antwort

Verwandte Themen