Javascript 为什么不是'；t AngularJS处理页面加载后附加到页面的元素？

假设页面上有一个区域如下所示：

<ul>
    <li id="li_1" ng-controller="FooBarCtrl as foobar" ng-init="setup_stuff(1)">
       <button id="button_1" ng-click="foobar.doButtonyThings">Weeeeeeee!</button>
    </li>
    <li id="li_2" ng-controller="FooBarCtrl as foobar" ng-init="setup_stuff(2)">
        <button id="button_2" ng-click="foobar.doButtonyThings">Weeeeeeee!</button>
    </li>
</ul>

---

当您附加包含指令的新html（如ng click）时，您需要使用$compile服务（需要注入该服务）来了解它：

 $compile(element.contents())(scope);

---

我们需要一些javascript代码来为您的用例提供更具体的示例。您最好使用一个数组，使用ng repeat对该数组进行迭代以输出html。这样，当通过添加/删除更改数组时，html将自动更新。

Angular在加载时“绑定”html。若你们以后添加HTML，你们需要告诉Angular，有新的东西需要“连接”，看看mcgraphix的答案。当然，我会添加我用来附加元素的逻辑。这个$compile可以从一个普通的javascript文件触发吗，就像上面我文章的编辑一样？我没有足够的吸引力来改变代码结构。。我对以前开发人员的结构有点纠结。你是如何触发javascript的？以这种方式混合角度代码和非角度代码有点奇怪。告诉我吧。。。基本上他们是完全孤立的。按下按钮，我调用someVanillaJSObject.addLine（）。这会附加该线，但现有的角点捕捉不到该线。为了让它更有意义，我被告知AngularJS需要从页面中完全删除，除了这一点。。。从技术上讲，您可以在运行非angular代码后创建的DOM节点上获得一个引用，然后只需调用：$compile（angular.element（yourNewElement））（$scope）

addLine:function(lineNumber)
{
    var lineTemplate = document.getElementsByClassName('template__line')[0];
    var newLine = lineTemplate.cloneNode(true);

    //replace template sections
    newLine.className = 'clearfix ng-scope';
    newLine.innerHTML = newLine.innerHTML.replace(/__lineNumber__/g, lineNumber.toString());
    newLine.style.display = 'block';
    document.getElementById('quick-order__body').appendChild(newLine);
}

 $compile(element.contents())(scope);