Angular 4 ngModelがなぜ別の変数を変更するのはなぜですか？

Question

Angular 4 ngModelで面白いバグが見つかりました。 コンポーネント：

this.restService.getProduct(this._id).subscribe(
    response => { 
    this.product = response; 
    this.productCategory = response.category; 
... 

は、テンプレート：私はあまりにもテンプレートでproductCategory._idのngModel値、this.product.category._id変化の値を変更

<select [(ngModel)] = "productCategory._id" class="form-control form- 
control-sm" id="category"> 
    <option *ngFor="let category of existedCategories | orderBy: 'name'" 
    value="{{category._id}}">{{category.name}}</option> 
</select> 

。

if (this.product.category._id !== this.productCategory._id) { 
observables.push(
    this.restService.changeProductCategory(this.product.category._id, 
    this.productCategory._id, this.product._id)); 
} 

は、私はこれをバイパスするためのいくつかの解決策を見つけた：

this.restService.getProduct(this._id).subscribe(
    response => { 
    this.product = response; 
    const resp = JSON.parse(JSON.stringify(response)); 
    this.productCategory = resp.category; 

をしかし、まだそれがなぜ起こるか理解していないと、このチェックはfalseを返します。

Answer 1

productCategoryは、product.categoryがメモリ内の同じ場所を参照しているためです。

角度4のバグではありません。これは参照型の仕組みです。私は勉強のためのリンクを添付しています：https://codeburst.io/explaining-value-vs-reference-in-javascript-647a975e12a0

Answer 2

あなたは参考にしています。別の動作が必要な場合は、クローンを実行する必要があります。 lodashにはcloneDeepがあります。