当前位置:  开发笔记 > 编程语言 > 正文

Angular 2:使用ngTemplateOutlet和ngOutletContext的嵌套模板

如何解决《Angular2:使用ngTemplateOutlet和ngOutletContext的嵌套模板》经验,为你挑选了1个好方法。

我正在尝试使用PrimeNG的p-dataScroller构建一个通用列表组件,如下所示:

p-dataScroller本身使用模板传播items数组中的每个项目.
selectedItem并且select()是相应的通用列表组件的方法.在这个组件中,我这样声明itemTemplate:

 @ContentChild(TemplateRef)
 public itemTemplate: TemplateRef;

最后我以下列方式使用我的通用列表组件:


  

如您所见,模板组件(list-item)本身有另一个模板!
首先,我想知道这是否存在问题(三个嵌套模板),但更重要的是,ngOutletContext似乎没有将值添加到每个模板中list-item.两者itemselected输入参数都存在于list-item组件中,但似乎没有设置它们.在调试时,Angular 2正确地将list-item组件添加为列表条目,但抛出异常,因为它缺少item输入参数AfterContentInit.有趣的是,itemType输入参数设置正确,可能是因为它不属于ngOutletContext.

我不能移动列表项组件的通用列表组件模板内,降低了复杂性,因为有几种不同类型的可以使用的物品(所有这些都具有item,selected等).

如何@Input()使用另一个模板中的值正确设置模板的参数?



1> Sebastian..:

这一切都是正确的,除了


  
  

这真的很难找到.找不到关于此主题的任何文档.

推荐阅读
臭小子
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有