问题标签 [angularjs-ng-transclude]

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 回答
160 浏览

angularjs - 如何使用 ng-transclude 在指令中访问 ng-repeat 的 $index 值

我正在尝试访问ng-repeatfrom within 指令的 $index 值。这是我的代码:

因为我需要使用集合的key来设计index.html中的模板。这是一个伪代码,其中 [1,2,3] 是集合。我想使用集合的键来访问 index.html 集合中的自定义值

0 投票
1 回答
103 浏览

javascript - Angular transclude in table cell element

I have an attribute directive which just adds a class name to the element on which it is applied. That attribute directive is applied to a table cell <td> element. When I have transclude: true in the directive definition it replaces the table cell content. I cannot figure out why. Can someone help me out since I'm facing this issue for the first time?

My understanding is by definition transclude should contain whatever content was in there already but not sure why I'm facing this issue. Can someone suggest a solution?

Here is the code,

the directive definition in html would look like,

As I mentioned earlier if I have transclude as false then it works as expected. But when I have transclude as true it adds the class and the table cell content disappears.

0 投票
2 回答
194 浏览

angularjs - 为什么在预链接功能中进行 DOM 转换不安全

在API 文档$compilePre-linking-functionAngularJS他们写道,在Pre-linking-function. 有谁知道为什么?

参考 API 文档部分

0 投票
0 回答
439 浏览

javascript - 在 Angular 中嵌入 HTML 内容的正确方法是什么?

我需要将包含div注销按钮的内容嵌入到我的自定义选择下拉指令之一中,但是嵌入的内容不会最终出现在指令模板内,而是出现在外部。如果我只是放一段字符串,例如Some content在指令而不是 HTML 中,则 transclude 有效。但是,一旦我放入 HTML,它就会拒绝工作。

所以我的问题是将 HTML 内容转入指令模板的正确和最简单的方法是什么?

指示:

用法:

模板:

0 投票
1 回答
24 浏览

javascript - html 父内容不会显示到 ngInclude anglurjs

我有这两个用于树视图的模板,我想使用第一种方法,但似乎有问题或者我错过了一些东西。

第一种方法(可取但不起作用)
TreeTemplate.html

节点模板.html

<li></li>TreeTemplate.html中的每一件事都不会出现ng-include

第二种方法(不可取但有效)

树模板.html

节点模板.html

请帮我弄清楚发生了什么。

0 投票
2 回答
216 浏览

angularjs - Angular 指令嵌入中断布局

我正在尝试在 ng-repeat 循环中嵌入表格行 (a),以便在用户单击 (a) 时可以显示/隐藏另一个表格行 (b)。两个表格行都在渲染,但是,<ng-transclude>在指令模板中需要在 (b) 之前包含 (a) 的元素正在破坏布局。如何在不破坏布局的情况下使用指令呈现两个表格行?

// 主模板

// 指令

// 指令模板

// 更新,我通过简单地使用 ng-repeat-start/end 解决了这个问题

0 投票
4 回答
870 浏览

javascript - 临时局部变量的 Angular 指令

我在这里要做的是创建一个指令,允许我设置仅适用于我正在呈现的 html 标记内的临时变量。用例是这样的:

这里的想法是 ng-local 指令创建一个变量opened并将该变量设置为初始值false。指令中的所有内容都是一个嵌入的模板。这里的好处是我可以在一个页面上拥有多个日期选择器,所有使用相同变量的人opened都无需在控制器的范围内拥有一堆不同的变量,这些变量仅用作内部内容的临时变量分区。但是,由于这将以多种不同的方式使用,我不想为每个用例制定不同的指令。

我在这方面的第一次尝试非常顺利。但是,我遇到了一个问题,start即没有从 datepicker 正确访问父范围变量。我对 $transclude 功能不是很熟悉,所以我希望有人能指出我正确的方向。这是我目前编写的指令:

提前致谢!

编辑

这是一个plunkr链接

https://plnkr.co/edit/pog2bcxEf8mDEb2vIVjP?p=preview

0 投票
1 回答
1974 浏览

javascript - 角度多重嵌入动态元素数量

Angular 1.5 支持多重转换。

值得注意的是,能够将动态数量的项目嵌入到指令中并在以后声明这些嵌入的名称和位置(例如在链接/编译中)会很有用。

为了进一步说明,我希望能够执行以下操作:

请注意,在实现多嵌入的指令声明中,我必须先了解在声明时将被嵌入的项目数量。

有没有办法在链接(或使用解决方法)中做这样的事情,这将保持与当前嵌入提供的相同功能?

0 投票
0 回答
117 浏览

angularjs - ngTransclude 无法正确呈现内容

尝试通过 Transclude 动态地将错误/反馈消息传递给指令。但是,由于标签跨度或innerForm.inputField.$error.....

编辑:括号 [text] 之间的文本是需要翻译的测试。不要为此感到困惑。

找不到有关嵌入内容限制的信息。希望能在这里得到一些指点。

DOM 中的指令标签

指令

指令模板

- 编辑 -

将此行添加到 Link 函数$compile(element.contents())(scope);“修复”问题但给我一个错误:

Error: [ngTransclude:orphan] Illegal use of ngTransclude directive in the template! No parent directive that requires a transclusion found. Element: <span class="alert alert-input" ng-transclude="">

0 投票
1 回答
746 浏览

javascript - 在旧版本中替代 Angular 嵌入后备内容

Transclude fallback content是添加到Angular V1.5.0 中的
功能之一会注入。 但我不能强迫所有人都使用 Angular V1.5.X 有没有替代的解决方案?Transclude fallback content

另一个解决方案:
由于我有一个巨大的 html 模板并且不能使其成为单行字符串或 ... 将其放入 JS 文件中,所以我分叉了Mario Lamacchia想法。

HTML:

JS: