使用AngularJS的.append中的数据绑定

Data Binding inside an .append with AngularJS

本文关键字：数据绑定 append 使用 AngularJS      更新时间：2023-09-26

我使用了这段代码(http://jsfiddle.net/ftfish/KyEr3/)创建一个表单，但我有一个输入，ng模型设置为"值"，我需要在TD:上用｛｛｝｝打印该值

angular.element(document.getElementById('space-for-table')).append("&lttd>{{value}}</td>");

我这样做是因为我需要在屏幕上打印HTML代码（这就是为什么我使用&lt;而不是<）。但是｛｛value｝｝不适用于此。

有人知道我该怎么做吗？我曾想过在变量（scope.value）中转换ng模型的值，但我不是AngularJS方面的专家。

使用$compile对新元素中的模板和指令进行角度处理

$compile(newElement)(scope);


angular.module('app', [])
.run(function($rootScope, $compile) {
  $rootScope.value = 123;
  var newElem = document.createTextNode("<td>{{value}}</td>");
  document.getElementById('target').appendChild(newElem);
  // important part:
  $compile(newElem)($rootScope);
  $rootScope.$apply();
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" id="target"></div>

尽管如果您只是添加具有不同数据的类似元素，您可能只想使用ng-repeat。

相关文章：