我正在尝试使用ng-include递归地显示元素的二叉树。
在这个例子中,
在这个例子中,
ng-init="item = item.left"
和 ng-repeat="item in item.left"
有什么区别?在这个例子中,它们的行为完全相同,但是在我的项目中,我使用类似的代码时它们的行为不同。我想这可能是由于Angular作用域的原因。也许我不应该使用ng-if,请告诉我如何更好地实现它。
pane.html 文件内容:<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>
控制器是:
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) {
return Array.isArray(item);
}
});
编辑: 首先,我遇到的问题是指令ng-repeat比ng-if具有更高的优先级。我尝试将它们结合使用,但失败了。在我看来,ng-repeat支配ng-if很奇怪。