使用 angularjs 和 jquery 创建动态可扩展表答案

【问题标题】：create a dynamic expandable table by using angularjs and jquery使用 angularjs 和 jquery 创建动态可扩展表
【发布时间】：2016-02-22 02:27:15
【问题描述】：

我想使用 JQuery 创建一个可扩展的表：http://ludo.cubicphuse.nl/jquery-treetable/#examples。

问题是angularjs和jquery有冲突。这是我的 html 文件：

<table>
   <tbody ng-repeat="row in construct.matrix.rows">
      <tr data-tt-id="row.name">
         <td>{{row.name}}</td>
         <td>
            <button ng-click="newField($index)">Add a Field</button>
            <form ng-submit="addField($index, fieldName, row)" ng-if="choose($index)">
               <input type="text" ng-model="fieldName" name="text" placeholder="New Field" />
            </form>
         </td>
      </tr>
   </tbody>
</table>

要使用 jquery 部分，我使用这个标签：

$(document).ready(function() {
   initialize();
});

function initialize() {
   $("table").agikiTreeTable({
      persist : false,
      persistStoreName : "files"
   });
}

我想在开头有一个只有一行的简单表格。在这一行上，用户可以单击一个按钮，然后提交一个新行，该行将是第一行的可扩展行。只是为了看看是否可行，我尝试这样做，但我明白我必须在提交第一个可扩展行后调用初始化函数。它有效，但如果我想再次进行操作，我会遇到一些冲突。

看这张图：

因此，如果有人有解决此问题的想法，我将很高兴听到。谢谢

【问题讨论】：

我不明白这个问题。你可以只创建一个 sn-p 或 bin 吗？这样我们会更容易为您提供帮助。
感谢您的帮助，但@beaver 解决了我的问题。我只是想创建一个动态表，但我不知道我只能使用 angularjs

标签： javascript jquery html angularjs expandable-table

【解决方案1】：

为什么不使用 Angular 库并避免使用基于 jQuery 的组件？

这里有一些替代方案：

【讨论】：

谢谢我找了几个小时这样的东西
所以我选择了这个解决方案：thienhung1989.github.io/angular-tree-dnd/demo/#/basic，这非常有用，但我不知道如何重新加载数据，所以如果你有任何想法会有所帮助。谢谢
重新加载数据？您的意思是在数据更改后更新 UI？请分享您与数据更新、树表源和代码相关的代码，以重现您的问题
是的，这就是我的意思。但没关系，我找到了怎么做。谢谢

【解决方案2】：

试试 ng-table 库，它内置了分组功能：

http://ng-table.com/#/grouping/demo-grouping-basic

【讨论】：