问题标签 [ng-template]

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

angular - 以角度 4 将模板的一部分从一个组件复制到另一个组件

基本上,我在组件 1 的模板中有这样的东西。

这在组件 2 的模板中,它是组件 1 的兄弟

我想要的是当组件 2 中的特定变量,比如说,"toggled" = true组件 2 的模板应该是这样的

我正在使用角度版本 4.0.0 。我阅读了有关 templateoutlet 的信息,但无法弄清楚如何在不同的组件之间共享它。有没有办法从一个组件复制模板片段并在另一个组件中使用它?

0 投票
2 回答
1299 浏览

angular - *ngIf/else 不工作 Angular4

我无法使用 *ngIf/else 语句工作。这是设置:

问题是我的真实陈述正在呈现(带有 的按钮View {{ daysBetween[i] | date:'EEEE' }}'s Plan),但我的虚假值(ng-template)不是。我看过几个教程,我认为我做得对,但我现在才研究 Angular4 几天。请帮忙!

0 投票
1 回答
1065 浏览

html - 如何在 Angular 2 的 ng2-tag-input 下拉列表中添加按钮?

我正在尝试使用 ng2-tag-input 为我的下拉菜单创建自定义模板。我用这个作为参考:这个链接。我已经使用 observable 检索了一个对象数组并填充了下拉列表。

这是我的 html 代码(还没有按钮):

我能够成功获得我的自定义模板,但我还需要显示两个按钮以及下拉值,如下所示:自定义模板重复,最后,我需要这两个按钮。我不知道如何添加它们,因为我是 Angular2 的新手。任何帮助,将不胜感激。

0 投票
1 回答
382 浏览

javascript - Angular 2 编写结构指令,如 ngFor、iterableDiffer 可能会导致错误

您好,我对 Angular 2 还很陌生,想写一个 ngFor 的实现来练习。我找到了这个教程: https ://teropa.info/blog/2016/03/06/writing-an-angular-2-template-directive.html

我让它工作,但最近我不断收到这个错误。“错误类型错误:this._trackByFn 不是函数”。

我希望可以对此进行更多调试,但文档很少,而且我并不完全理解 IterableDiffer(s)。所有人都看到它在第 41 行之后死了。我一直试图弄清楚我现在改变了几个小时。

这是plunk:http ://plnkr.co/edit/aM8Wdz72gu7BVNAN9Ulv?p=preview

感谢您提供的任何帮助。

更新:

我发现如果我在 Angular 2 中运行它,我可以让我的指令工作,并去掉不同的类型,如下所示:
private differ:IterableDiffer(now)
private differ:IterableDiffer<any>(before)

仍然不是解决方案,因为我想弄清楚如何在 Angular 4 中完成这项工作。

0 投票
1 回答
78106 浏览

angular - 为什么 *ngIf 不能与 ng-template 一起使用?

我在模板中有一个条件如下:

我有包含rowand的数据集seatNo,但它似乎没有在模板中打印。这里有什么问题?

0 投票
4 回答
25166 浏览

angular - 角度 2 中的 $implicit 是什么?

angular2 ng-templates中如何使用以下关键字

  • $implicitangular 2模板的目的是什么?
  • let-<attribute>和之间是什么关系$implicit
0 投票
2 回答
16860 浏览

angular - 以编程方式打开 ng-bootstrap 模式

我有一个 Angular 4 页面,包括一个 ng-bootstrap 模式。我的代码看起来像这样。

foo.html

脚.ts

现在,当我单击按钮时,模式会打开。我现在要做的是在 ngChanges 上打开模型。

我的问题是:我如何在这里获得“内容”?有没有办法以编程方式获取 ng-template?提前致谢!

0 投票
1 回答
2387 浏览

javascript - 如何在 angular-4.x 中使用类似于 ng-container 的选择器

我正在使用 angular-4.x 和内部组件我正在使用一些“abc”选择器,如下所示:

但是“Abc”标签也存在于 DOM 中,但我希望它表现为“ng-container”,它只反映页面中的子 DOM而不是标签本身。

0 投票
1 回答
174 浏览

angular - 用于 md-tab material2 中复杂标签的 ng-template

我正在使用material2 md-tab。根据文档,如果我想为选项卡标题提供更复杂的标签,那么我需要使用ng-templatewith md-tab-label。我只是想知道他们为什么选择了策略ng-template方式?是不是应该有

像这样,因为其他材料组件md-card已经定义了<md-card-title><md-card-subtitle>

0 投票
0 回答
3047 浏览

angular - 在 ng-container 中创建动态组件,添加 ng-template 并监控 ngModel

我创建了一个动态组件,我可以从外部向它注入模板。我的目标是能够注入任何模板,在组件内复制这些模板,并以两种方式将数据绑定到它以获取数据更改。

它看起来像这样:

HTML,我有一个add button按钮可以动态添加更多模板,我有一个trash button删除模板:

我像这样使用这个组件:

我正在使用 ng-prime,因此p-dropdown.

所以我想要的是能够创建那些动态组件,向其中注入任何模板,并能够使用这个动态组件复制这个模板。此外,我希望从下拉列表中选择的数据插入到我的数据中,因此ngModel.

我遇到的问题:

  • 我不确定这是否是实现我目标的最佳设计。回复的index那个,对我来说似乎很尴尬。
  • 基本上它正在工作,除了splice部分。当我spliceing 时,数据模型在再次渲染后获取新索引container,一切都一团糟,数据不在sit应有的位置。我也考虑过发送数据并让组件管理它,但我不确定这是正确的做法,甚至不确定如何去做。

如果有不清楚的地方,我将不胜感激您的建议并添加信息。

更新 1: 添加plnkr

如您所见,我正在添加元素,当我尝试删除它们时,它会从底部删除。我必须知道我的基本方法是否良好,然后才能确定如何相应地删除和更新我的数据数组。