问题标签 [angularjs-compile]

所以我建立了一个网站，我希望将其他 .html 文件动态加载到 div 中。每个 .html 文件都包含一些内容，但 1 个 .html 文件包含自己的 angularjs 指令。

我正在使用ng-bind-html和$scope.content = $sce.trustAsHtml(data); 但我发现这会打印出 html raw （不处理任何角度指令）。

我尝试使用各种解决堆栈溢出的解决方案，但没有一个对我有用。

网站：http ://algorithmictrading.azurewebsites.net/

App.js：http ://algorithmictrading.azurewebsites.net/js/app.js

正在加载的 .html 页面示例：http: //algorithmictrading.azurewebsites.net/includes/home.html http://algorithmictrading.azurewebsites.net/includes/about_us.html

.html 包含角度指令的页面：http: //algorithmictrading.azurewebsites.net/includes/download.html

如您所见，如果您导航到网站并单击“下载”选项卡，则会加载内容，但不会处理下拉菜单中的角度。我添加的测试按钮也应该产生一个警告框。

现在，代码基于这个线程： 在 Angular js 中的 $sce.trustAsHtml() 字符串中调用函数

谢谢！

我正在尝试从控制器动态添加自定义指令。为了添加指令，我做了以下事情。

自定义指令的模板如下：-

以上只是一个简化的示例，仅用于演示目的。

因此它成功地在 DOM 中添加指令并在 ng-repeat 中执行所有功能，但我无法在文本框中输入任何内容，因此无法通过用户输入过滤结果。

请帮我解决这个问题。我仍在学习 AngularJS 的概念，所以这也可能是一个天真的错误。

编辑我也尝试过添加

通过这样做，我可以在模板内输入输入框，但这不是在 ng-repeat 中过滤“搜索”的结果。

我需要编译一个指令，因为它需要一个从数据库返回的 ID，但似乎无法让它持续到指令中。

orderId 在指令内部始终未定义。

普朗克

我正在阅读这篇关于角度性能优化的文章，那里有以下段落：

Directive 的编译函数在附加作用域之前运行，是运行任何 DOM 操作（例如绑定事件）的理想场所。从性能的角度来看，要认识到的重要一点是，传递给 compile 函数的元素和属性表示原始 html 模板，在 Angular 进行任何更改之前。这实际上意味着在这里完成的 DOM 操作将运行一次，并始终传播。另一个经常被忽略的重要点是预链接和后链接之间的区别。简而言之，预链接从外向内运行，而后链接从内向外运行。因此，预链接提供了轻微的性能提升，因为当父级修改预链接中的范围时，它们可以防止内部指令运行第二个摘要循环。

我无法理解这两个部分以及如何使用它来提高性能：

这实际上意味着在这里完成的 DOM 操作将运行一次，并始终传播。

和这个

预链接提供了轻微的性能提升，因为当父级修改预链接中的范围时，它们可以防止内部指令运行第二个摘要循环

如果有人可以对此进行详细说明，我将不胜感激。

我有一个 AngularJS 指令，它呈现为自定义社交分享小部件。在每天大约 10,000 次页面浏览中，大约有 1 到 2 次，Angular 在开始编译指令后会出错。这使得 DOM 中的原始 HTML 部分对用户可见。

我只知道这个错误，因为它是由几个用户报告的。我无法重现它，但我设计了一些信息日志，表明它正在发生。

每次发生这种情况：

• 浏览器始终是 Chrome
• 操作系统是 Mac 或 Windows
• Angular 开始编译阶段，但在开始发布链接之前失败
• Angular 在编译阶段报错，但传递给 '$exceptionHandler' 服务的 'exception' 对象始终为空。
• 没有报告其他 JavaScript 错误

此错误在多天内发生在某些相同的 IP 上。

有没有人有类似的问题？

编辑

这是我的代码...

JavaScript：

HTML：

我正在尝试在 Angular 中动态生成一个按钮。单击时，该按钮需要调用该deleteRow()函数并传入用户名。适用的用户名已成功传递给控制器​​，并且生成的按钮代码似乎已正确生成。但是，它们的按钮最终会传递undefined给该deleteRow()函数。这是我使用方式的问题$compile吗？

HTML如下：

我正在构建一个仪表板组件，以允许用户添加显示底层数据库各种指标的小部件。每个小部件都是一个不同的指令。为了在仪表板中正确调整小部件的大小，我需要访问指令模板中定义的属性，但很难找到这样做的方法。

我通过编译它的指令来添加小部件：

然后将其附加到仪表板容器中：

我需要设置“w”和“h”的值，并将这些属性嵌入到小部件的指令模板中：

问题是，编译指令后如何访问 my-rows 和 my-cols ？我知道我可以为每个小部件定义一个服务以从外部访问小部件的配置，但这似乎是巨大的开销。

在上面的示例中，我可以很容易地访问“test”属性，但不能访问“my-rows”或“my-cols”。

我创建了一个下拉输入指令，用户可以在其中传入模板字符串来设置列表实际呈现的内容。在我的示例中，我正在传递，<div style="background-color: darkgrey" ng-style="{\'color\': isActive?\'red\':\'blue\'}">{{index}}</div>因此它将呈现项目索引号，然后根据 isActive 对其进行着色。索引显示正确，背景颜色正确但 ng-style 被忽略。我在 setTimeout 中创建模板，因为我必须等待 ng-repeat 渲染<li>.

我正在遍历<li>元素并为每个元素设置模板。我使用 $interpolate 而不是 $compile 因为使用 $compile 会导致 [[Object HTMLDivElement]] 而我不知道为什么。据我所知，$compile 无论如何都使用 $interpolate，它可以工作，除了 ng-style、ng-show 和 ng-hide 不起作用。为什么 Angular 的指令不能与 $interpolate 一起使用？

这是工作示例plunker。

我是 AngularJs 的新手，在下面的代码中遇到了麻烦。

我从日志中得到的输出是'{{xa}} {{xb}}'，它应该是

这是plunker源代码

我在自定义指令编译的模板中表示 ng-repeat 时遇到问题。请找到我的 plunker http://plnkr.co/edit/5A5oZf5kwBezB4mqZ56C?p=preview。即使问题出现了，但选项没有出现。我怀疑我在模板格式中的以下代码是否正确？