访问角的数据动态地添加DOM元素使用jQuery

我有一个表行，我可以动态地添加到使用一些jQuery的，像这样一个现有的表：访问角的数据动态地添加DOM元素使用jQuery

$("#add-item").click(function(){ 
    var itemRow = "<tr><td><span contenteditable='true'><a href='#'>Edit me<a/></span></td></tr>"; 
    $("#job-table").hide(0).append(itemRow).fadeIn(500); 
});

我也有一些数据绑定我可以做的角度，像这样：

<div> 
    <input type="text" ng-model="data.message"> 
    <h1>{{data.message}}</h1> 
</div>

我想是有这样的事情：

$("#add-item").click(function(){ 
    var itemRow = "<tr><td><span contenteditable='true'><a href='http://something.com/{{content.url}}'>content.url<a/></span></td></tr>"; 
    $("#job-table").hide(0).append(itemRow).fadeIn(500); 
});

问题是角度无法访问这个动态加载的元素，因为它在加载时不可用。

什么是最好的方法来实现这一目标？

来源

2013-10-21 ryanSrich

在一个侧面说明，你应该使用指令对DOM操作。 – tymeJV

实现这一目标的最好方法是忘记你对jQuery的一切了解。将“items”数组放入您的示波器并使用ng-repeat。

伪代码：

<tr ng-repeat = "item in items"> 
<td><span contenteditable='true'><a ng-href='http://something.com/{{item.url}}'>item.url<a/></span></td> 
</tr>

现在使用ng-click触发增加一个项目的项目数组，你是好去。不需要jQuery。它甚至可以像<button ng-click="items.push({url:'what'})">add</button>一样简单，它会自动出现。

这里有一个小提琴：http://jsfiddle.net/VEbsU/1/展示一个完整的例子

来源

2013-10-21 19:10:11

很好的例子和解释。 – ryanSrich

访问角的数据动态地添加DOM元素使用jQuery

回答

相关问题