将值从一个模板传递到另一个

我是新手@angular，但是我看不到有关如何将Input变量从一个组件传递到另一个组件的任何提示。我有一张将json对象作为输入的卡，并且可以{{ json.name }}在该模板上打印，但是无法传递json.name给子组件：

  <nb-card-header>
    {{ cardDetails.name }}
  </nb-card-header>
  <ngx-gauge-chart [name]=cardDetails.name></ngx-gauge-chart>

量规图组件：

@Component({
  selector: 'ngx-gauge-chart',
  styleUrls: ['./summary-card.component.scss'],
  template: `
    <div echarts
         class="echart"
         [options]="options">
    </div>
  `,
})
export class GaugeChartComponent implements OnDestroy {
    ngOnDestroy(): void {
      this.alive = false;
    }
    @Input()
    name: string;
  private alive = true;
  options: any;
  themeSubscription: any;

  constructor(private theme: NbThemeService) {
    this.themeSubscription = this.theme.getJsTheme().subscribe(config => {
    this.options = {
      series: [
        {
          startAngle: 180,
          endAngle: 0,
          thick: 15,
          type: 'gauge',
          showSymbol: false,
          data: [{value: 55, name: this.name}],
          axisLabel: {
            show: false,
          },
        },
      ],
      };
    });
  }

}

谁能给我提示如何通过，cardDetails.name以便可以将其作为ngx-gauge-chart组件上的输入阅读？