Angular 断开组件和模板之间的绑定

我只是尝试学习Angular并使用示例，我通过在组件的末尾添加一个愚蠢的z来更改组件属性的名称，例如：

selectedProductZ : string

但我在模板中保留了正确且原始的名称，末尾没有愚蠢的Z，因此类似于：

  <div class="form-group">
    <label>Product Name 1</label>
    <input class="form-control" [(ngModel)]="selectedProduct"/>
  </div>

  <div class="form-group">
    <label>Product Name 2</label>
    <input class="form-control" [(ngModel)]="selectedProduct"/>
  </div>

我还使用了一个ng serve命令重新启动了

---

所以我希望它会中断并停止更新，因为我已经更改了组件上属性的名称，但为什么它仍然有效？所以模板中的这个selectedProduct与要开始的组件中的一个无关？

[ngModel]->正在进行双向数据绑定。例如，当我们在输入框中更改时，{{selectedProductZ}中的值将更改

<div class="form-group">
        <label>Product Name 1</label>
        <input class="form-control" [(ngModel)]="selectedProductZ"/>
      </div>

    <div>
    {{selectedProductZ}}
    </div>

---

在末尾添加Z后，是否保存了更改？你能在stackblitz中重现这一点吗？一旦你添加了z，你做了什么，你期望发生什么，以及发生了什么？仍然在工作是一个太模糊的描述。JavaScript是一种动态语言，因此您可以动态地在对象上添加属性。。那么至少我学对了？那个东西来自/应该来自组件？使用ng build-prod。检查它是否显示错误。有时，您无法检测html文件错误。您是否使用VS代码？请添加一些说明，说明您的代码如何以及为什么能够解决此问题。仅仅添加一个片段没有任何意义。