Ich versuche, einen binären Baum von Elementen anzuzeigen, den ich mit ng-include rekursiv durchlaufe.

Was ist der Unterschied zwischenng-init="item = item.left" undng-repeat="item in item.left"? In diesem Beispiel verhält es sich genauso, aber ich verwende ähnlichen Code in einem Projekt und dort verhält es sich anders. Ich nehme an, es liegt an Angular Scopes. Vielleicht sollte ich ng-if nicht verwenden, bitte erkläre mir, wie ich es besser machen kann.

The pane.html ist:

<div ng-if="!isArray(item.left)">
    <div ng-repeat="item in [item.left]" ng-include="'Views/pane.html'">
    </div>
</div>
<div ng-if="isArray(item.left)">
    {{item.left[0]}}
</div>
<div ng-if="!isArray(item.right)">
    <div ng-repeat="item in [item.right]" ng-include="'Views/pane.html'">
    </div>
</div>
<div ng-if="isArray(item.right)">
    {{item.right[0]}}
</div>

<div ng-if="!isArray(item.left)">
    <div ng-init = "item = item.left" ng-include="'Views/pane.html'">
    </div>
</div>
<div ng-if="isArray(item.left)">
    {{item.left[0]}}
</div>
<div ng-if="!isArray(item.right)">
    <div ng-init="item = item.right" ng-include="'Views/pane.html'">
    </div>
</div>
<div ng-if="isArray(item.right)">
    {{item.right[0]}}
</div>

Der Controller ist:

var app = angular.module('mycontrollers', []);

app.controller('MainCtrl', function ($scope) {

    $scope.tree = {
        left: {
            left: ["leftleft"],
            right: {
                left: ["leftrightleft"],
                right: ["leftrightright"]
            }
        },
        right: {
            left: ["rightleft"],
            right: ["rightright"]
        }
    };

    $scope.isArray = function (item) {
        retu,rn Array.isArray(item);
    }
});

EDIT: Zuerst stoße ich auf das Problem, dass die Direktive ng-repeat eine höhere Priorität hat als ng-if. Ich habe versucht, sie zu kombinieren, was fehlgeschlagen ist. IMO ist es seltsam, dass ng-repeat ng-if dominiert.