试图在Angular中动态构建表

时间:2016-08-02 02:28:14

标签: angularjs

In this plunk我有一张表的指令。我正在尝试使用两个单元格动态地向表中添加一行。尽管如此,该表仅显示一个单元格。这段代码出了什么问题?

的Javascript

angular.module('app', []);


angular.module('app')
.directive('directive1', function() {


    var directive = {};

    directive.restrict = 'E';

    directive.scope = true;

    directive.template = '<table class="c" border="1"></table>';

    directive.link = function(scope, element, attrs) {

                var t = angular.element(".c");
                var r1 = t.append("<tr></tr>");
                var col1 = r1.append("<td></td>");
                col1.text("1111");
                var col2 = r1.append("<td></td>");
                col2.text("2222");

    };

    return directive;

});

2 个答案:

答案 0 :(得分:1)

这也可以起作用:

var t = angular.element(".c");
var r1 = t.append(angular.element(document.createElement('tr')));
var col1 =angular.element(document.createElement('td')).html("1111");
var col2 =angular.element(document.createElement('td')).html("2222");
r1.append(col1);
r1.append(col2);

答案 1 :(得分:0)

这有效:

            var t = angular.element(".c");
            var r1 = $("<tr></tr>")
            t.append(r1);
            var col1 = $("<td></td>");
            r1.append(col1);
            col1.text("1111");
            var col2 = $("<td></td>");
            r1.append(col2);
            col2.text("2222");