Angular 无法在步进器组件内执行数据绑定

我有两个输入字段，分别是

课程名称

（自动完成组件）和

价格

（输入组件）： 选择特定的

课程名称

，将根据

课程名称

显示

价格

，如下所示：

现在，我已将这两个输入字段（即课程名称和价格）放在步进机组件中。然后数据绑定没有发生（即，在选择

课程名称时，我无法显示
价格
）

这是stackblitz
有两个问题：

如果使用的是
[（ngModel）]
，则应使用
名称
属性。但你还没用过

此实现存在一个问题：


这里，字符串
CCNA培训
，
Java指导
和
PHP培训
应该是，
数学
，
物理
，和
化学

因为你的自动完成只有数学、物理和化学

以下是一个供您参考的示例。
为什么是
matPrice
、
phyPrice
和
chemPrice
字符串数组？很抱歉，我在stackblitz中发布时没有更改代码现在我已经更新了stackblitz…）@SiddAjmeraThanks以获取您的答案和指导….）
this.offeringControl.valueChanges.subscribe((d) => {
  console.log('Changed');
  console.log('d: ', d);
  if (d === 'CCNA Training') {
      this.price = this.matPrice;
    } else if (d === 'Java Coaching') {
      this.price = this.phyPrice;
    } else if  (d === 'PHP Training') {
      this.price = this.chemPrice;
    }
  });