angularjs – 将指令嵌套在表中
发布时间:2020-12-17 17:16:08 所属栏目:安全 来源:网络整理
导读:这可能吗?我希望能够根据用户输入整齐地换出一个表体,所以我只是把这个小*测试放在一起看看它是否会起作用,但是它加载所有的不稳定,主体在表格本身之前和之外DOM即使我在我的 HTML中适当地嵌套它.所以我的问题是这样的: 1)这种行为到底是什么?和 2)我可以
这可能吗?我希望能够根据用户输入整齐地换出一个表体,所以我只是把这个小*测试放在一起看看它是否会起作用,但是它加载所有的不稳定,主体在表格本身之前和之外DOM即使我在我的
HTML中适当地嵌套它.所以我的问题是这样的:
1)这种行为到底是什么?和 2)我可以实现我想要的方式吗? * simple fiddle HTML: <div ng-app="myApp" ng-controller="myController"> <table class="table"> <thead> <tr> <th>Month</th> <th>Savings</th> </tr> </thead> <my-directive></my-directive><!-- this should be the tbody --> <tfoot> <tr> <td>Sum</td> <td>$180</td> </tr> </tfoot> </table> </div> JS: var app = angular.module("myApp",[]); app.directive("myDirective",function () { return { restrict: 'E',template: '<tbody><tr><td>January</td><td>$100</td></tr><tr><td>February</td><td>$80</td></tr></tbody>',}; }); 解决方法
您当前正在< my-directive>< / my-directive>中呈现标记.元素,这是搞乱表格布局.
相反,将您的指令更改为基于属性的指令,并将其放在< tbody>上.元素,替换内容.. 模板 </thead> <tbody my-directive></tbody><!-- this should be the tbody --> <tfoot> 指示 return { restrict: 'A',template: '<tr><td>January</td><td>$100</td></tr><tr><td>February</td><td>$80</td></tr>' }; 见工作fiddle. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |