问题标签 [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 投票
0 回答
359 浏览

angularjs - 在谷歌地图信息窗口中 $compile 后未定义 ng-click 事件

在这个角度谷歌地图中,​​我想让链接能够出现在用户搜索地址时生成的动态信息窗口中。现在我已经让信息窗口正确加载,但 ng-click 事件返回未定义。

我已经编译了 HTML 字符串,但仍然没有乐趣。这是编译代码:

选择标记时,信息窗口加载正常,但是当在信息窗口内单击“ng-click”时,它会返回:

未捕获的类型错误:未定义不是函数

我提供了一个 jsbin 链接来显示代码:

http://jsbin.com/zukefa/edit

在此先感谢您的帮助。

0 投票
1 回答
15410 浏览

angularjs - 我可以获得 Angular 元素的编译后的 html 吗?

我已经使用 $compile 服务编译了一个元素。如果我直接将它添加到 DOM,它看起来很棒并且所有绑定都是正确的。如果我希望该元素作为字符串,它会显示{{stuffHere}}而不是绑定。有没有办法在编译后获取元素的html?

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

附加到正文的元素显示content is Hello, World!

警报显示<div><div><span ng-binding>{{content}}</span></div></div>

我想从警报中看到的是<div><div><span ng-binding>Hello World</span></div></div>

0 投票
2 回答
925 浏览

javascript - AngularJS:在 API 返回的 HTML 中编译指令

所以我可以访问我正在访问的 REST API,它返回以下预生成的 HTML:

这对我学习 AngularJS 提出了一个有趣的新挑战。我无法控制从 API 返回的 HTML,因为它不是我构建的 API。

我正在尝试做的(这可能是完全错误的方法)是在“v”类上构建一个类指令,这样我就可以将 ng-click 属性添加到经文编号并将经文信息传递给到我的应用程序的另一部分。

下面是我目前拥有的代码,它似乎没有做任何事情,尽管我认为它会。

使用 API 返回的 HTML 填充的 HTML 模板:

所以我希望发生的事情是将 HTML 填充到绑定 html 的底部 div 中,然后以某种方式调用 $compile 以将“v”类 sup 转换为我可以修改的指令。再说一次,我对 Angular 还是很陌生,所以可能有一种超级简单的方法可以像 Anguler 中的大多数其他东西一样,我还没有找到。

实际上,最终目标是将每个经文编号转换为自己的指令,以便能够使其可点击并访问它所具有的 id 属性,以便我可以将该信息与一些用户内容一起发送回我自己的 API。

这感觉像是很多信息,所以如果有任何不清楚的地方,请告诉我。我会努力解决这个问题,所以如果我先弄清楚,我一定会更新答案。

进行中

检查了这个问题:https ://stackoverflow.com/a/21067137/1507210

现在我想知道尝试将显示诗句的部分转换为指令是否更有意义,然后使搜索控制器使用来自服务器的 HTML 填充范围变量,然后将其用作模板对于指令...想想想想想想

0 投票
1 回答
1542 浏览

angularjs - 在模板渲染之前编译指令

我正在为 Angular 中的 States Select 制定指令。它正在工作,但我花了一段时间试图找出一种在模板进入 DOM 之前编译模板的方法。它目前的工作方式如下:

但因此,它将模板插入到元素中,然后针对范围编译它。有一个更好的方法吗?例如在模板插入之前编译模板?

0 投票
2 回答
2179 浏览

angularjs - AngularJS在指令中设置输入要求

我需要动态地使输入字段成为必需(或不需要),并希望在指令中设置此值。我知道有 ng-required 指令,可以设置为 ng-required="datamodel.required" 但最终,我想在指令中提取一个设置对象并根据该配置打开/关闭所需的参数。配置在服务中,我不想为我的每个表单控制器注入服务 - 因此我需要在指令中进行设置。

这是一个 JSFiddle 起点:http: //jsfiddle.net/hm2b771z/2/

我期望的是第一个字段选项是必需的,而第二个字段仍然是可选的。

谢谢!

0 投票
1 回答
647 浏览

angularjs - AngularJS 指令 - 可以在 postLink 之后调用“模板”函数。

解释起来很复杂,但我会尽力。

http://plnkr.co/edit/PrVXRvHAC7wtgHUEU1HB?p=preview

这个例子按我的需要工作,我只是不喜欢我实现这个的方式。

我将尝试解释您在示例中看到的内容。

<item>指令应将自身“注册”repeateravailable_item. 它现在不应该显示。

<repeater>指令应该打印可用项目的菜单,并且在单击菜单项后,它应该将项目的模板添加到它的内容中。例如repeater模板可能看起来像这样:

那么在我的工作plnkr.co 示例中我不喜欢什么?

我不喜欢我必须包含<div ng-transclude></div>在 my 中repeater.html,否则<item>'s 将不再被编译。但我不需要在页面加载时打印项目——它们只是模板。我已将<items>模板设置为空字符串,但在源代码中我看到空<item>标签,我不喜欢这个..

实际上我不确定我不喜欢那里的什么,但感觉一切都在hard-coded那里,不是吗?

Ifrepeater的指令将按以下顺序编译:

  1. controller() - add2available() 函数将被注册
  2. 预链接()
  3. //现在是所有item指令,它们可以将自己注册到转发器
  4. 后链接()
  5. 模板() - 现在转发器更改它的模板,其中没有ng-transclude

我确定这是不可能的。而且我不确定我不喜欢我的代码中的哪些内容,但我希望您能看到其他改进我的代码的方法。

非常感谢!

PS我知道我可以用一些标签替换<item>指令,但我需要在我的示例中提供。<script type="text/ng-template" id=""><item>

0 投票
1 回答
1605 浏览

angularjs - 在 ng-repeat 中链接编译 html

我一直在寻找这个问题几个小时,我似乎无法在这里找到解决方案。

我正在尝试创建一个应该能够呈现 HTML 的功能位的指令。我认为通过 $compile 运行 HTML 就足够了,但它似乎只有 1 级深度。

如何编译我的数据的 rawHtml 部分,以便 ng-click 起作用?

** 编辑:我想出了如何使用 angular sanitize 来返回 HTML,但是,它仍然没有被编译。如何将其编译到范围?

Plunker:http ://plnkr.co/edit/f9nxHlbRThzSHoD3Awhp?p=preview

和JS

0 投票
1 回答
215 浏览

angularjs - 在Angularjs中,如何确保只有在完成for循环中的所有承诺后才能使用动态模型名称进行模板编译

我正在使用 Angularjs 和 c3 图表指令。我的模板编译代码是

我希望这个模板编译代码只有在 for 循环内的所有承诺都完成后才能执行。任何人都可以帮助我如何实现它?而且对于动态分配模型名称,我使用了 $scope[data.chartIdent],这是正确的方法吗?以下是我的控制器的示例代码。

使用 $q.all,如何动态地制定模板,这里的 'i' 值不适用于模板,因为我们不在 for 循环中。

0 投票
1 回答
638 浏览

angularjs - AngularJs 在 pjax 后停止工作

我在页面上同时使用 AngularJs 和 Pjax。

使用 Pjax 重新加载我的页面的一部分后,Angularjs 停止在那里工作。

简单的 {{ 2+2 }} 除了用 pjax 重新加载的部分外,在任何地方都可以工作。

我发现,问题在于使用 $compile。

我尝试了不同的代码片段,但没有一个对我有用。

这个也没有

也不是这个

代码片段对我有用。有人知道可行的解决方案吗?

UPD: 在 PSL 建议将 $("body") 更改为 $(document.body) 之后,代码开始工作。但是现在一切都是从头开始初始化的,并且在每次 pjax 调用之后我都会丢失我的数据(在我的示例中选择的图像)。我怎样才能避免这种情况?

这是我的 js 文件:

0 投票
0 回答
542 浏览

javascript - 角度 ng-src 不刷新图像

我正在执行从图像列表中选择图像的功能。我从每个按钮中都有一个“选择”按钮,并在单击按钮时调用 selectImage 方法。

角应用:

风景:

... PJAX 部分与网格和分页一起使用

和每个项目的 ng-click="selectImage(39)" 按钮

PJAX 部分结束

毕竟在javascript中:

在 pjax 通话后,我有一些奇怪的行为。当我单击选择按钮时,将调用 selectImage 方法。它会更改 selectedIMageUrl ,每次单击选择按钮时我都可以在 span 中看到不同的 url。但是图像(指定 ng-src 的位置)没有改变。

不过,在 pjax 调用之前,图像更改效果很好。

PS:我明白,做 jsFiddle 片段会更好,但我会遇到服务器端的问题。