angularjs - AngularJS 和生成的元素

Question

我们有一些第三方 javascript 组件正在生成一些 html 元素。我想将它与 AngularJS 结合起来。

我试过这段代码

<div ng-controller="ExpensesCtrl">
    <form id="expensesform">
        <input type="text" ng-model="expense.name" />
        <input type="text" ng-model="expense.amount" />
    </form>
    <button ng-click="add()">Add</button>expense | json
</div>

---

function ExpensesCtrl($scope) {

    $scope.expense = {};
    $scope.add = function () {
        $("#expensesform").append("<input type='text' ng-model='expense.age' />");
    };
}

http://jsfiddle.net/tChNh/

但它不像例外那样工作。

有没有机会让这个工作？

Answer 1

这是错误的方法，但是对于这种特殊情况，您需要执行以下操作：http: //jsfiddle.net/wXZL7/1。注入 $compile 服务。

同样，这不是使用 Angular 的正确方法。Angular 的做法是“你不必在控制器中弄乱 DOM，让 HTML 和指令来做”。

您想创建一个指令来包装生成元素的任何内容并让它执行。阅读指令指南以获取示例：http ://docs.angularjs.org/guide/directive

Answer 2

角度方式，让您的模型完美同步，并动态添加或删除输入类型将使用http://jsfiddle.net/3BVMm/1/

你应该提供我们在这里谈论的插件，也许 Angular 只用几个代码就可以把这个插件吹走......

Answer 3

我找到了这个答案：Compiling dynamic HTML strings from database

也许它可以帮助其他人。它描述了如何使用该$compile服务让 Angular 了解已知代码。