问题标签 [angularjs-compile]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
895 浏览

angularjs - 如何编译 Angular 模板并使用 appendChild 将其插入 DOM?

我正在尝试在页面 html 中插入一个新的。这个 div 应该从 Angular 模板中获取它的内容。

我已经尝试过了,但它不起作用。

tpl 返回空值。

0 投票
1 回答
171 浏览

javascript - 返回和编译链之前的角度指令的功能

可以在返回任何内容之前在指令中运行 javascript,也可以在返回任何内容之前在指令的编译步骤中运行 javascript:

这会产生以下控制台日志顺序:

我对此有几个问题:

1)为什么我会在返回实际指令对象之前运行代码?什么是用例?

2) 为什么我想在返回前/后链接函数之前运行代码?预链接步骤与编译步骤有何不同?什么是用例?

3)当有两个项目时,为什么编译会连续运行两次,而其他所有项目都以与元素数量无关的相同顺序迭代运行?

Plunk:http ://plnkr.co/edit/1JPYLcPlMerXlwr0GnND?p=preview

0 投票
1 回答
1778 浏览

javascript - 使用 Angular 的 $compile 时在脚本标签中添加控制器

$compile-ing 一个角度 HTML 模板字符串时,我试图将额外的控制器和指令放在<script>标签内,并在 HTML 模板中使用它们。

这样,我实际上是在尝试实现某种插件机制,以便我可以加载增强应用程序功能的外部文件。

<script>标签确实得到了评​​估,但我的问题是,HTML 模板编译发生在 JavaScript 评估之前。所以编译器抱怨缺少控制器。


例子:

http://plnkr.co/edit/8oZYhRHAjP84ecnl6hG3?p=preview

此示例引发错误:Error: Argument 'Controller' is not a function, got undefined

如果您在 中删除第 15-18 行(引用创建的控制器的 HTML)app.js,您可以在控制台中看到以这种方式创建控制器确实有效。

0 投票
2 回答
326 浏览

jquery - AngularJS registering DOM elements when added from outside Angular

I have a scenario where I have to add DOM elements using jQuery. But the application I'm working on is developed with angular and I need those elements accessible in Angular. Example Scenario:

I have a similar scenario. How can I access "#outsideDiv" and how my click function will get called? Is there a way to make angular walk the DOM manually and register newly added elements?

0 投票
1 回答
93 浏览

javascript - AngularJS:插值属性

假设我有以下两个指令:

以及以下 HTML:

外部指令控制台调试触发,内部没有。我有什么好方法可以实现这种行为吗?

Plunk:http ://plnkr.co/edit/jXbtWvYvtFXCTWiIZUDW?p=preview

0 投票
0 回答
288 浏览

javascript - AngularJs compile a directive in another module

in angular Js I have created a module of mine and trying to use a module xeditable (http://vitalets.github.io/angular-xeditable/). There is a directive in my module which I am trying to compile in a directive in xeditable but it stays the same (the edit panel does not show my control, in code it is still showing name of my directive).

This is the line in xediable where I think it should get compiled:

I thought it was due to dependency so I added the dependency of myApp into editable. Here is how is bootstrap angular:

Here is how I register xeditable:

The code $compile(self.editorEl)($scope); does not set return value in anything. So does this mean that self.editorEl will be updated after compilation?

I am looking at right area or do you think the error is somewhere else? No exception is being thrown.

0 投票
2 回答
2565 浏览

angularjs - 从循环动态创建指令

我有一个main directivearray的范围,其中包含用于构造其他directives应编译并附加到main directive.

问题是,当我遍历该数组时,我只能从数组中的最后一个元素中获取数据,因此我无法为每个自定义指令正确绑定相应的数据。

普朗克

主要指令:

要嵌套的指令:

数据如下所示:

据我所知,编译不会在forEach语句中立即发生,这就是为什么每个指令都从具有 id 的对象unique_id_3(数组中的最后一个元素)获取数据的原因。此外,所有指令都有独立的范围。

编辑:我知道在 forEach 中我需要将值添加到范围中,以便可以pass将其添加到嵌套指令隔离范围中,并且我知道循环完成时scope.value 将是循环的最后一个value,但我的印象是compile 会将immediately值传递给嵌套指令并完成它。

那么,什么时候编译呢?

我怎样才能绕过这个限制?

0 投票
2 回答
176 浏览

angularjs - 在 AngularJS 中,如何从模板生成一段内容并在单击链接时将其插入 DOM

我在页面上有许多链接,动态生成如下:

我还有一个简单的自定义模板,应该显示一个项目的名称:

我想做的是:单击链接时,动态编译模板,并将其插入到链接之后的DOM中。我尝试在 showStats 方法中使用 $compile 来编译模板,但是我得到了一个错误,即 $compile 没有找到。我将如何执行此操作(并且还提供项目作为新生成模板范围的一部分)?

0 投票
1 回答
103 浏览

javascript - AngularJS:如何将指令编译为另一个指令?

我有编译的 Angular 指令

  1. <greeting /><print-greeting />

  2. <print-greeting />Hello World!

我怎样才能把greeting标签放在我的 HTML 中并让它编译到print-greeting最后显示Hello World!?它目前在变成 后停止print-greeting

这是我的代码:Plunker


从上述 plunker 复制的指令:

greeting指示

print-greeting指示

0 投票
1 回答
792 浏览

angularjs - 有没有方便的方法来检查 DOM 元素是否在 AngularJS 中是`$compile`d?

我正在尝试将一些普通的 JavaScript 库与 AngularJS 集成,其中我需要手动$compile一些 DOM 元素。我正在做这样的编译:

e.srcElement是我想要的 DOM 元素$compile

我想知道,是否有任何既定的方法来检查给定的 DOM 元素是否已被编译。

我知道如果我在编译期间将一些数据属性附加到 DOM 并尝试稍后检索它是可能的。我想知道的是AngularJS中是否有任何现有的方法。

谢谢!