在Angular 7中,动态内容投射可以通过使用ng-content指令来实现。ng-content指令允许在组件模板中插入动态内容,并通过组件的投影机制将该内容传递到组件的子组件中。
下面是一个示例,演示了如何在Angular 7中使用动态内容投射:
import { Component } from '@angular/core';
@Component({
selector: 'app-parent',
template: `
Parent Component
`,
})
export class ParentComponent {}
import { Component } from '@angular/core';
@Component({
selector: 'app-child',
template: `
Child Component
`,
})
export class ChildComponent {}
This is some dynamic content.
在上述示例中,父组件中的ng-content指令用于定义动态内容的投影区域。然后,父组件的模板中使用子组件app-child,并将动态内容传递给子组件。子组件中的ng-content指令用于显示父组件传递的动态内容。
运行应用程序后,将会显示一个父组件和一个子组件。子组件中将显示父组件传递的动态内容。
这就是在Angular 7中实现动态内容投射的解决方法。