从组件标签中获取子元素

Question

我想知道 Angular 中是否允许这种机制：

<app-form-general>
  <p>Hello</p>
</app-form-general>

Angular 编译它并显示app-form-general，但我找不到它处理子元素的方法。我想创建具有动态元素数量的组件，但遗憾的是我猜这不是可获得的。或者有什么东西可以处理内部子数据？

Answer 1

你应该在你的组件'app-form-general'中做。

您希望在组件中的任何位置显示子组件。添加这个 'ng-content'

@Component({
  selector: 'app-any-component', // not app-root
  template:  '<button (click)="add">   
                 <ng-content></ng-content>
              </button>',
  styleUrls: ['./app.component.css']
})
export class AnyComponent{

}

// 其他组件

 <app-any-component> Hello </app-any-component>

Here is stackblitz