Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了typescript – Angular 2.0 – @ViewQuery和@Query之间有什么区别大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
从我在QueryList的 Angular 2 documentation中读到的内容,@ Query应该允许将子组件的引用注入到给定组件中.

使用@QueryView我设法获得对子DOM元素的引用,如下所示:

@H_262_3@// Parent component's template <my-component #test> // Parent component class ParentComponent { constructor(@Query('test') child: QueryList<any>) {...} }

我希望@Query可以返回匹配的组件而不是DOM元素,但是我没有设法让它工作,也没有找到任何表明这样的文档.

这两个装饰器有什么区别?

首先,您必须了解Light DOM和Shadow DOM是什么.这些术语来自Web组件.所以 here is the link.一般来说:

> Light DOM – 组件的最终用户提供给组件的DOm.
> Shadow DOM – 是您(作为组件的创建者)定义并且对最终用户隐藏的组件的内部DOm.

我想,看下一个例子,你可以很容易地理解什么是什么(here is the plunker):

@H_262_3@@Component({ SELEctor: 'some-component' }) @View({ template: ` <h1>I am Shadow DOM!</h1> <h2>Nice to meet you :)</h2> <ng-content></ng-content> `; }) class someComponent { /* ... */ } @Component({ SELEctor: 'another-component' }) @View({ directives: [someComponent],template: ` <some-component> <h1>Hi! I am Light DOM!</h1> <h2>So happy to see you!</h2> </some-component> ` }) class AnotherComponent { /* ... */ }

那么,你的答案很简单:

PS该示例显示了简单的内容投影.但是< ng-content>可以做更复杂的事情.见this issue.

大佬总结

以上是大佬教程为你收集整理的typescript – Angular 2.0 – @ViewQuery和@Query之间有什么区别全部内容,希望文章能够帮你解决typescript – Angular 2.0 – @ViewQuery和@Query之间有什么区别所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。