我試圖在未選中復選框時刪除數組的一部分（如果復選框值與數組項中的值匹配）。當用戶單擊復選框時創建的數組工作正常，但是當未選中復選框時，我嘗試刪除/拼接的數組對象現在是字符串對象，因此無法拼接。我的困惑是關于為什么數組在第二次循環后“變成”字符串對象。我正在努力的主要代碼塊開始于：onCheckboxChange(option, event)Stackblitz 在這里：https ://stackblitz.com/edit/angular-match-groceries-sweetsimport { Component } from '@angular/core';// import * as d3 from "d3";@Component({  selector: 'my-app',  templateUrl: './app.component.html',  styleUrls: [ './app.component.css' ]})export class AppComponent  {  name = 'Angular';  grocery_list: any;  treats: [];  box: any;  allTreats: any;  noDupes: any;  selectedAll: any;  isChecked: boolean;  showTreats: any;  checkedList: string[] = [];constructor(){}ngOnInit(){  this.getTreats();}  getTreats(){  this.grocery_list = [      {"fruit": "apple", "veggie": "lettuce", "sweets": ["cookies", "cake"]},      {"fruit": "orange", "veggie": "asparagus", "sweets": ["cookies", "ice cream"]},      {"fruit": "apple", "veggie": "carrots", "sweets": ["No Data", "cake"]},      {"fruit": "apple", "veggie": "lettuce", "sweets": ["cookies", "No Data"]},    ];  this.treats = this.grocery_list.map(x => x.sweets);   this.box = [].concat.apply([],this.treats);  this.noDupes = Array.from(new Set(this.box));  this.allTreats = Array.from(this.box)  }// this is where the check/uncheck logic starts    onCheckboxChange(option, event) {      let eChecked = event.target.checked;     if(eChecked) {       this.grocery_list.forEach(x => {         x.sweets.forEach(y => {           if (y === option){             this.checkedList.push(x);           }         });       });// this is the part that isn't working     } else {       this.checkedList.forEach(c, i => {         c.sweets.forEach(k => {           // if 'sweet' name = option, remove its array object           if (k === option) {             this.checkedList.splice(i, this.checkedList.length)           }         })         })      }     }}