从Angular中的孙组件访问祖父母组件属性

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-grandparent',
  template: `
    <app-parent [parentProperty]="grandparentProperty"></app-parent>
  `,
})
export class GrandparentComponent {
  @Input() grandparentProperty: string;
}

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-parent',
  template: `
    <app-child [childProperty]="parentProperty"></app-child>
  `,
})
export class ParentComponent {
  @Input() parentProperty: string;
}

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-child',
  template: `
    <p>Grandparent Property: {{ childProperty }}</p>
  `,
})
export class ChildComponent {
  @Input() childProperty: string;
}