[英]component inside component Angular
What is it called when one component is inside another? 当一个组件位于另一个组件内部时,该怎么称呼? like in
像
<agm-map [latitude]="lat" [longitude]="lng">
<agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>
</agm-map>
And how it works? 以及它如何运作?
You have to use ng-content
您必须使用
ng-content
<ng-content></ng-content>
<ng-content select="agm-marker"></ng-content>
you have to declare two components as: 您必须将两个组件声明为:
agm-map.component.ts AGM-map.component.ts
@Component({
selector: 'agm-map',
template: '<ng-content></ng-content>
<ng-content select="agm-marker"></ng-content>'
})
export class AgmMapComponent {
...
}
agm-marker.component.ts AGM-marker.component.ts
@Component({
selector: 'agm-marker',
template: '<div>Marker</div>'
})
export class AgmMarkerComponent {
...
}
But I guess you want to pass latitude/longitude to your child component for that you can read the documentation related to how to pass data from parent to child component here 但是我想您想将纬度/经度传递给子组件,因为您可以在此处阅读有关如何将数据从父组件传递到子组件的文档
I am fairly sure, that the middle component won't get rendered. 我相当确定,不会渲染中间组件。 It is an invalid sytax.
这是无效的语法。
You can, however, create recursive component patterns with at least 2 different components, like this: 但是,您可以使用至少两个不同的组件创建递归组件模式,如下所示:
In a "recursion-container" component's html: 在“递归容器”组件的html中:
<agm-map ....
in agm-map component.html: 在agm-map component.html中:
<recursion-container"...
So you basicly need a middle-layer for it. 因此,您基本上需要一个中间层。
On basic component communication, you can read the documentation 关于基本组件通信, 您可以阅读文档
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.