角2組件之間的單向綁定

Question

我想知道爲什麼，Angular 2中的單向綁定只適用於字符串屬性，而不適用於字符串數組？

我有一個父組件和一個子組件......我傳遞了字符串和一個字符串的集合，並且在內部我更改了它們，並且在子組件指令中修改了字符串屬性類型，而不是在父組件中指令（這是我期望的那樣），但是，當我修改數組的第一個元素，變化既體現在，家長和孩子的模板......

父組件

names : Array<string> = [...] 
name : string = "App Works"; 

兒童組件

@Input("names") _names : Array<string>; 
@Input("title") _name : string; 

父組件模板

{{names | json}} 
<app-person [names]="names" [title]="name"> 
    <p>Awesome !!!</p> 
</app-person> 

預期的行爲是，如果我試圖修改數組的第一個元素在我的子組件的指令，該變化不會反映在父項，但在子項中。

我學習和PluralSight做一些教程...

Answer 1

這一點，因爲你是共享同一個實例的預期。如果不想共享更改，那麼您應該在子組件中克隆數組。

Answer 2

Javascript有一個瘋狂的方式handling function params。如果您傳遞一個字符串作爲參數（或任何原始值），您的函數獲得此字符串的副本，並且任何修改都不會影響函數外部的原始變量，只會影響其內部的副本。

這正是我們所期望的許多語言，但對於其他類型（非原始），該功能沒有得到帕拉姆的副本，它實際上得到一個參考原始對象的任何修改在函數內完成將改變原始對象。

我認爲這是你的問題的原因。

要解決這個問題，您可以創建一個數組副本。一種方法是從JSON序列化/反序列化你的數組到/從JSON序列化：

function(myExternalArray) { 
    let myLocalArray = JSON.parse(JSON.stringify(myExternalArray)); 
    // YOUR CODE HERE 
}