Javascript 如何将ng模型添加到运行时创建的html对象中

我有这样一个简单的html表单

<div ng-app="app">
    <form action="" ng-controller="testController" id="parent">
    </form>
</div>

输入字段也会按预期生成get

<input type="number" id="testId" name="test" ng-model="test">

但是此输入字段和

$scope.test

之间的ng模型不起作用。

重要提示：您不应该在cotroller中进行dom操作，您需要使用一个指令来进行操作

也就是说，即使在指令中，如果要创建动态元素，也需要对其进行编译，以便对其应用角度行为

var-app=angular.module（'app'，[]，function（）{}）
app.controller（'testController'，['$scope'，'$compile'，testController]）；
函数testController（$scope，$compile）{
var input=document.createElement（'input'）；
var form=document.getElementById（'parent'）；
输入.setAttribute（“类型”、“编号”）；
setAttribute（“id”、“testId”）；
输入.setAttribute（“名称”、“测试”）；
setAttribute（“ng模型”、“测试”）；
$compile（输入）（$scope）
表单。追加子项（输入）；
}

测试：{{test}

在控制器中执行dom操作是错误的做法。。。您需要使用

$compile

services来编译新元素使用一个用于DOM操作的指令，而compileisn不是一个指令吗？或者我对指令的理解有误吗？只要需要操作DOM、使用指令或使自己拥有指令，您就可以创建自己的指令

<input type="number" id="testId" name="test" ng-model="test">