angularjs NG格:行之间的父子关系(隐藏/显示行)父子、行之、关系、angularjs

2023-09-13 02:42:04 作者:我没有钱我不要脸

我想实现渲染NG-网格predefined隐藏的行和某些特定事件我想向他们展示。我试图模拟样行之间的亲子关系,但所有的行都将被渲染并放置在通常的方式。

I'm trying to implement rendering the ng-grid with predefined hidden rows and on some particular event I want to show them. I'm trying to simulate kind of parent-children relation between rows, but all rows will be rendered and placed in usual manner.

默认情况下,子行会被渲染为坍塌

By default the "child" rows will be rendered as "collapsed"

当父项被点击行会显示为扩大儿童

When the parent item is clicked the children rows will be shown as expanded

我试图找到 gridOptions 的一些解决方案的 rowTemplate 设置,但我希望有人已经面临着这样那样的问题,也许你已经解决了它与这将是非常有益的,如果你可以分享你的想法/解决方案。

I'm trying to find some solutions with gridOptions rowTemplate settings, but I hope somebody has already faced with this kind of problem and maybe you have already solved it and it would be very helpful if you can share your ideas/solutions.

或者,如果它是一个新的问题,这将是解决这个问题的最好办法?

Or if it's a new issue, what will be the best way to solve it?

感谢

推荐答案

我添加几个字段到模型中的id,parentId的,和扩展。在切换行NG-点击,它调用toggleExpansion将扩展状态行。 NG-节目确定是否根据扩展标志显示行

I added a few fields to the model for id, parentId, and expanded. On ng-click of the toggle row, it calls toggleExpansion to set the expanded state for the row. ng-show determines whether to show a row based on the expanded flag.

我做了一个Plunker证明: http://plnkr.co/edit/fOMMXePQhWAF4DOnF3dW?p=$p$pview

I made a Plunker to demonstrate: http://plnkr.co/edit/fOMMXePQhWAF4DOnF3dW?p=preview

下面是一些链接到相关的问题。见关于第二个链接行高度CSS解决方案的告诫。

Here are some links to related questions. See the caveats about the row height css solution in the second link.

如何获得NG-电网隐藏某些行

角NG-网格行高度