52

要素のバイナリ ツリーを表示しようとしていますが、これは 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 よりも高いという問題に遭遇しました。それらを組み合わせようとしましたが、失敗しました。IMO ng-repeat が ng-if を支配するのは奇妙です。

4

4 に答える 4

49

少しハックですが、JSON オブジェクトを含む配列の ng-repeat を使用して、変数を ng-include に渡しています。

<div ng-repeat="pass in [{'text':'hello'}]" ng-include="'includepage.html'"></div>

インクルード ページでは、次のように変数にアクセスできます。

<p>{{pass.text}}</p>
于 2015-12-01T11:42:43.793 に答える
3

文字列を含む配列の ng-repeat で ng-include を使用しています。複数のデータを送信したい場合は、Junus Ergin answer を参照してください。

私のコードスニペットを参照してください： 

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="">
<div ng-repeat="name in ['Sanjib Pradhan']" ng-include="'your_template.html'"></div>
<div ng-repeat="name in ['Chinmay Sahu']" ng-include="'your_template.html'"></div>


    <script type="text/ng-template" id="your_template.html">
          {{name}}
    </script>
  </div>

于 2016-11-29T05:38:19.737 に答える