Question

我有table个项目。我想通过点击项目打开这个项目的评论列表。我使用directive来实现此目标，并将数据附加到我的element。问题是数据被附加到table的右侧而不是放在行之间。我尝试使用open \ closing tr标记，但它也没有帮助。

我的html页面：

<div id="content_people" ng-show="active=='people'" ng-controller="DevsListCtrl">
    <table ng-table="tableParams" class="table">
        <tr feedback-holder ng-repeat="d in $data">
            <td add-new-team-member data-title='name' data-value="{{d.name}}" bs-tooltip="tooltip">{{d.name}}</td>
            <td data-title='age'>{{d.age}}</td>
            <td data-title='grade'>{{d.grade}}</td>
            <td data-title='job'>{{d.job}}</td>
        </tr>
    </table>
</div>

我的js指令：

mainApp.directive("feedbackHolder", ['$compile', 'teamSharedObj', function ($compile, teamSharedObj) {
    return {
        restrict: 'A',
        link: function( scope, element, attrs ) {
            element.bind('click', function() {
                console.log("Click on feedback");
                var el = angular.element('</tr><tr><div><input type="submit" value="Refresh"></div>');
                $compile(el)(scope);
                element.append(el);

            });
        }
    }
}])

你能告诉我一个正确的方法吗？谢谢。

Answer 1

如果您想在行之间插入新内容，请使用element.after()代替element.append

element.after(el);

您插入的元素也应如下所示：

var el = angular.element('<tr><td colspan="4"><input type="submit" value="Refresh"></td></tr>');

Answer 2

您可能只需要colspan喜欢：

var el = angular.element('</tr><tr><td colspan="4"><input type="submit" value="Refresh"></td>');

通过单击项目在表行之间添加新元素

2 个答案: