Angular 8 - FormBuilder.group 不保留數組

Question

我試圖從[key:string]:any設置一個表單組，但它不保留數組，當數組有一個位置時它變成一個數字，當它有一個以上時我收到錯誤.

// Example
let keyList = {
    'TestArray' = [1],
    'Name' = 'John'
};
let formGroup = this.formBuilder.group(keyList);
console.log(formGroup.get('TestArray').value); // 1 instead of [1]

Answer 1

要創建值數組，您應該創建 formArray

組件.ts

 let keyList = {
    'TestArray':this.formBuilder.array([[1]]),
    'Name' : 'John'
};

let formGroup = this.formBuilder.group(keyList);
console.log(formGroup.get('TestArray').value);

Answer 2

'TestArray' = [1]表示您正在創建 formControl 而不是 formArray。 用於創建 formArray 使用formBuilder.array

const array = [1,2,3];
let keyList = {
    'TestArray' = this.formBuilder.array(array),
    'Name' = 'John'
};

請參閱創建不同類型控件的示例：-

createForm() {
    this.form = this.formBuilder.group({
      'firstName': 'MyFirstName',
      'lastName' : ['MyLastName'],
      'contact': ['99999999999', [Validators.required]],
      'agree': [true, Validators.requiredTrue],
      'hobbies': this.formBuilder.array(['reading, cooking']),
      'locations': [[], Validators.required],
    });
  }

Answer 3

嘗試這個：

let keyList = {
        'TestArray' : new FormControl([1]),
        'Name' : 'John'
    };
  let formGroup = this.formBuilder.group(keyList);
  console.log(formGroup.get('TestArray').value);

你會得到的輸出是這樣的：

[1]
0: 1
length: 1