Javascript js中带有angularJS的动态html

首先我想让你明白我想做什么，也许我想用的解决方案不太好，我会很高兴听到建议。 我建立了一个系统（网站），用户可以填写输入，我想在论文的最后发送数据（可能是表格？）。 输入是使用javascript动态创建的（我的意思是document.createElement..）

所有的输入都不是在一个表单中，只是在html中输入而不是表单

现在我检查了一下，发现当我写输入时，它不会改变输入的值（可能是因为没有表单？）

无论如何，我想使用angularJS并使用隐藏的div，这将从用户那里获得输入值。。 我试着这样使用angularJS：

function getDefaultAmount(lines_number){
    var defaultAmount = document.createElement("div");
    defaultAmount.id = "AmountValue_" + lines_number;
    defaultAmount.setAttribute("class", "inlineBlock amountValueStyle");
    defaultAmount.setAttribute("data-ng-app", "myApp");

    var amountInput = document.createElement("input");
    amountInput.setAttribute("type", "text");
    amountInput.setAttribute("class", "inlineBlock");
    amountInput.setAttribute("placeholder", "enter amount");
    amountInput.setAttribute("data-ng-model", "name");
    defaultAmount.appendChild(amountInput);

    var amountVal = document.createElement("div");
    amountVal.id = "AmountVal_" + lines_number;
    amountVal.setAttribute("class", "inlineBlock");
    amountVal.setAttribute("data-ng-bind", "name");
    defaultAmount.appendChild(amountVal);

    return defaultAmount.outerHTML;
}

调用getDefaultAmount的函数是：

var amount = document.createElement("div");
    amount.id = "Amount_" + lines_number;
    var addClass = document.createAttribute("class");
    addClass.value = "amountStyle";                          
    amount.setAttributeNode(addClass);
    amount.innerHTML = '<span class="inlineBlock">' +"amount:"+ '</span>' + getDefaultAmount(lines_number);

var amount=document.createElement（“div”）；
amount.id=“amount\u”+行数；
var addClass=document.createAttribute（“类”）；
addClass.value=“amountStyle”；
amount.setAttributeNode（addClass）；
amount.innerHTML=''+''金额：'+''+getDefaultAmount（行数）；

这是行不通的…我的意思是当我在输入中写入时，我没有看到我在另一个div中写入的内容

当我把简单的代码放在主页面上，而不是通过javascript，它工作得很好，我的意思是代码工作得很好：

<div ng-app="">
<p>Name: <input type="text" ng-model="name"></p>
<p ng-bind="name"></p>

姓名：

---

也许我真的不需要使用angularJS，数据应该通过我将要构建的ajax调用来传递…（已经构建，问题是我在输入中得到空值…。

您需要使用$compile来编译添加的html

在您的情况下，添加以下生成的html后：

var amount = document.createElement("div");
amount.id = "Amount_" + lines_number;
var addClass = document.createAttribute("class");
addClass.value = "amountStyle";                          
amount.setAttributeNode(addClass);
amount.innerHTML = '<span class="inlineBlock">' +"amount:"+ '</span>' + getDefaultAmount(lines_number);

---

在控制器中。

如果不使用

$compile

让angular编译，就不能将html放入具有angular指令的dom中，并期望它们能够工作them@charlietfl在附加内容后，可以使用

angular.bootstrap

。。但是他必须有

angular.module

来引导它。好吧，我添加了您在amount.innerHTML之后编写的编译行。。。现在我得到了一个错误：uncaughtreferenceerror:$compile没有定义，我试图在谷歌上读到它的一些指令？那是什么意思=\@拉斐尔，你需要把它注入你的控制器。看看这个链接

$compile(amount)($scope);