【发布时间】：2017-09-08 23:00:27
【问题描述】：
我有一个简单的 javascript 代码，可以将 HTML 内容动态添加到 div 标签。
function addData(id,title,title_data){
var htmlcode='';
htmlcode+=`<h1> Title: `+title+` </h1> <div ng-app="">
<input ng-model="model`+title+id`" ng-init="model`+title+id+'='+\'`+title_data+`\'`" >`+
`<p ng-bind="model`+title+id`"> </p>`;
return htmlcode;
}
那我就这么简单地使用它：
$('#someDiv').html(addData(1,'Some Title','Some title data'));
html 运行良好并显示所需的动态内容。但是角度绑定不起作用。从 Web 浏览器复制粘贴的渲染 html 版本可以很好地工作，包括绑定，但动态的则不行。似乎是什么问题？
【问题讨论】：
-
我认为这可能是因为在页面加载期间已经为现有实体创建了绑定。而且您稍后会尝试在代码中添加新的绑定。
-
首先，
$('#someDiv')是 jQuery 代码，而不是 Angular；尝试以这种方式使用角度是非常不规则的，不推荐。这似乎表明您的整体应用程序设计可能并未完全采用角度。如果您能够重构您的应用程序以删除 jQuery 并且 仍然 发现您需要这样的 HTML 字符串（而不是角度模板或类似的），那么，只有这样，你应该看看如何编译动态表达式。 -
除了我的最后一条评论之外，您在此处使用的实际 Angular 代码是 非常古老的语法，对于 Angular 版本 1.2，它已经超过 3 年了。
ng-app===""时，较新版本的 Angular 将无法工作。 -
任何修改 DOM 的代码都应该作为指令来实现。您将 JQuery DOM 操作与 Angular 混合在一起。在您告诉 angularjs 编译并重新运行摘要循环之前，角度数据绑定将无法在这里工作。
-
这里的主要问题是 angular 在页面加载时被初始化；在页面完成加载后向 DOM 添加
ng-app并不会告诉 Angular 它应该去寻找那个元素。如果您坚持认为这是开发此应用程序的唯一方法，您将负责手动引导应用程序 (docs.angularjs.org/guide/bootstrap)，但这通常意味着您需要了解更多关于该框架是如何工作的，并且在您花时间了解它之后，您会意识到这确实是一个多么糟糕的想法。
标签： javascript angularjs ng-bind