angularJS中的隐藏元素未编译答案

【问题标题】：hidden elements in angularJS not compiledangularJS中的隐藏元素未编译
【发布时间】：2012-11-25 14:20:14
【问题描述】：

我的应用程序中有一个弹出窗口，它在页面加载时隐藏，仅在单击特定按钮时才会出现。我的弹出 DOM 中有以下代码

<a ng-click="settings();">welcome</a>

当我将它放在页面加载时可见的 DOM 中时，相同的代码可以工作。但在弹出窗口内，它不起作用。它永远不会进入 settings() 函数。谁能帮我解决这个问题？

【问题讨论】：

定义“隐藏”。此外，请尝试在 settings() 中不使用分号。为了提高获得帮助的机会，请设置一个 jsfiddle.net 示例，该示例具有相同的问题。
通过“隐藏”元素，我的意思是，我有一个 html 部分，将在单击时直接插入到 DOM。因此，该 DOM 中的任何角度函数都不会被编译。我知道我可以使用 $compile(jQuery('#partial_dom_id')) 但我可以在部分内部使用它吗？

【解决方案1】：

您可能应该为它创建一个指令。请参阅documentation 和this example。请注意，范围应用于编译的返回值，实际上是var compiled=$compile(element.contents()); compiled($scope);。

请注意，Angular 中已经有 a built-in include directive 可以满足您的需求。此处的示例响应下拉列表中的更改，尽管您可以轻松调整它以响应点击事件。

【讨论】：