8

この種の問題に対する簡単な解決策があるかどうか疑問に思っています。

オブジェクトのコメントがあります。これにはコメントを含めることができ、それらのコメントにもコメントを含めることができます...そして、これは不明な数のサイクルにわたって続く可能性があります。

データ構造の例を次に示します。

var comment = {
   text : "",
   comments: [
      { text: "", comments : []},
      { text: "", comments: [
         { text: "", comments : []},
         { text: "", comments : []}
         { text: "", comments : []}
      ]}
   ]
}

2 レベルのコメントについては、次のように記述します。

<div ng-repeat="comment in comments">
   {{comment.text}}
   <div ng-repeat="comment in comments">
      {{comment.text}}
   </div>
</div>

「n」レベルのネストされたコメントに div を実装するにはどうすればよいですか?

4

2 に答える 2

11

最も簡単な方法は、ジェネリック パーシャルを作成して、 を使用して再帰的に呼び出してレンダリングできるようにすることng-includeです。

<div ng-include="'partialComment.html'" ng-model="comments"></div>

ここに部分があります：

<ul>
    <li ng-repeat="c in comments">
      {{c.text}}
      <div ng-switch on="c.comments.length > 0">
        <div ng-switch-when="true">
          <div ng-init="comments = c.comments;" ng-include="'partialComment.html'"></div>  
        </div>
      </div>
    </li>
</ul>

データ モデルはリストにする必要がありますvar comments = [{ ... }]。

デモを作成しました。お役に立てば幸いです。

Demo

于 2013-08-18T02:41:21.850 に答える