问题标签 [angularjs-ng-transclude]

我正在尝试围绕输入元素构建一个指令，该指令在模型被弄脏或触摸时做出响应。所需的 ngModel 似乎反映了输入模型的值和视图的变化，但没有其他属性。

我怀疑这与我在两个元素中包含 ng-model 的事实有关，但我还没有弄清楚如何只使用它一次。

理想情况下，我想要这样创建的东西：

结果如下：

这是我到目前为止所拥有的：小提琴

该指令监视 ngModel。

在尝试嵌入的时候，我想看看需要某个父指令控制器的被嵌入指令在被嵌入到所需的父项下后是否能够找到它。我使用的指令如下： 有一个 ParentOfParent 指令，它具有 transclude:true。有一个指令 Parent 嵌入到 ParentOfParent 指令模板中有一个 Child 指令需要 Parent 控制器，并且被 ParentOfParent 嵌入为 Parent 指令的子指令。

我遇到的是使用包含和不包含克隆的嵌入函数之间的奇怪差异。当我使用嵌入函数输出（不传递 cloneFn）时，我收到一个错误，即子指令无法在其上方找到父控制器。 http://plnkr.co/edit/JteQpPMc6nbVNjRDHVZ2

但是，当我通过 cloneFn 使用它时，一切正常。

嵌入指令是否有可能在插入到控制器所属的指令下方后找到所需的控制器？

我得到了一个指令，transclude: element我想将模板应用于带有 ng-options 的选择元素，以使用给定的模板包装选择。

用法：

但是由于某种原因，被包装的是来自 ng-options 的选项，而不是 select 本身，正如您在此处的最终 DOM 中看到的那样。

我认为选择元素在嵌入的某个点被删除，但我不太确定。我发现ngOptions的tranclude: element只是有点混乱。

我怎样才能让这个选择与tranclude: elementand一起正常工作ngOptions？我可以在编译/前/后链接功能中做些什么吗？

笨蛋。

案例一：

我有一个指令（让我们称之为'x'），元素级别限制'E'嵌入在一个指令中（让我们称之为'y'），具有隔离范围。'y' 在模板中有两个嵌套的 ng-repeats'。

JSBin： http: //jsbin.com/hudani/edit ?html,js,output

行为： “x”采用“y”的父作用域，即控制器作用域（预期行为为某些调用同级作用域）

案例二：

我有一个指令（让我们称之为'x'），其属性级别限制'A'嵌入在一个具有隔离范围的指令（让我们称之为'y'）中。'y' 在模板中有两个嵌套的 ng-repeats'。

JSBin： http: //jsbin.com/monoco/2/edit ?html,js,output

行为：被嵌入的内容将第二个 ng-repeat 作为同级作用域，将第一个 ng-repeat 作为父作用域。

请建议一些资源来确认这种行为，并在可能的情况下提供一些对封闭指令（'x'）的不同限制所显示的不同行为的一些见解。

我有以下代码。我想嵌入 3 个不同的级别，我不明白为什么它不起作用

我想要发生的事情是这样的：

这是一个演示链接 http://plnkr.co/edit/CIZp7OzrPU5D6db0p7lK

似乎忽略了标题和内容模板。任何想法如何让这个工作

我正在尝试为表构建一个指令来显示数据。

该表有一个标题和一个正文。

理想情况下，我希望有以下指令：

这样我就可以将它们与 ng-transclude 一起使用

但是，这不适用于 my-table 的以下模板：

当页面呈现时，我最终得到以下内容：

我看到有人提到 ng-transclude 不能很好地处理表格。例如，如果你把

浏览器将 ng-transclude div 移到表格之外

我想知道是否有人有解决此问题的经验，因为这似乎是一件相当合理的事情。

干杯!

我有两个指令，可以说：

第二个：

指令 A 的 HTML：

指令 B 的 HTML：

我想像这样使用它们：

如何使用 require 和 ng-transclude 使它们相互通信并渲染两个模板？例如，我想在directiveB 模板中从directiveA 打印测试变量。我是指令和嵌入的新手。

我不能ng-transclude在模板内使用指令。我收到以下错误：

错误：[ngTransclude:orphan] 在模板中非法使用 ngTransclude 指令！没有找到需要嵌入的父指令。元素：

嗨，我正在研究需要编辑 DOM 添加 ng-src 属性和模型的指令。

这是我的 DOM

我需要结果 DOM

这样当我用数据更新 myModel 时，应该更新图像

更新

sam.directive('editComponent', function() { return { restrict: 'EA', transclude: true, replace: true, templateUrl: "imageTemplate.html", link: function(scope, element, attb, ctrl, transclude) { scope.data = function() { var imagedata; imagedata = arguments[5]; scope.imageModel = imagedata.base64; return element.find('img').attr('src', "data:image/png;base64," + imagedata.base64); }; } }; });

我还需要以前的src属性值来显示现有图像。

现在我手动更新src属性。我需要可以通过模型变量更新的解决方案

谢谢

I have a popover, and this popover has ngTransclude. We show/set popup with ngSwitch (true/false). The issue here is that ngTransclude is inside ngSwitch and this slows down the application, because every time we show a popover we have to transclude/$compile. Is there a way to fix this issue?

Now we cannot just move transclude outside of popup, because that means, if I have a ng-repeat inside transcluded element, this ng-repeat is watched then, but we dont want that, we want to watch for this ng-repeat when popup is opened.