使用 Boolean 條件循環通過兩個 JSON Arrays [角度 10]

Question

我有兩個來自外部的 JSON arrays 我想在 Angular 中循環，但我不確定該怎么做。

object 中的第一個數組看起來像 ViewAttributes.FunctionNames，第二個數組是 ViewAttributes.FunctionActive。

現在我正在使用正確的菜單，但我的目標是在 boolean position 每個值為true 而不是 false時在菜單選項中顯示正確的 FunctionNames 值。 我需要改變什么？

例如，我的代碼如下：

view.component.html

  <mat-menu #contextMenu="matMenu" #contextMenu2="matMenu">
    <ng-template matMenuContent let-action="action">
      <button mat-menu-item (click)="onContextMenuAction(action)">{{FunctionNames}}</button>
    </ng-template>
  </mat-menu>

view.component.ts

      // Right Click Context Menu for View Data Table

    onContextMenu(event: MouseEvent, action: ViewDataSource) {
      event.preventDefault();
      this.contextMenuPosition.x = event.clientX + 'px';
      this.contextMenuPosition.y = event.clientY + 'px';
      this.contextMenu.menuData = { action: action };
      this.contextMenu.menu.focusFirstItem('mouse');
      this.contextMenu.openMenu();
      console.log(this.FunctionNames);
    }

    onContextMenuAction(action: ViewDataSource ) {
      console.log(action);
      console.log(parseInt(action[0]));
      console.log(parseInt(action[3]));

      // this.launchService.launchAction(this.line.targetActionTag.value, this.line.targetActionType);
      // tslint:disable-next-line: radix
      this.launchService.launchAction(parseInt(action[0]), parseInt(action[3]));
    //   debugger;

    }

我的兩個 JSON 陣列 object 看起來像：

ViewAttributes.FunctionNames = [Value1, Value2, Value3, ....]

ViewAttributes.FunctionActive = [true,false,true, ...]

Answer 1

如果您想在FunctionActive數組中的相應索引處顯示基於 boolean 值的FunctionNames 。那么下面的代碼可能會對您有所幫助

ViewAttributes.FunctionNames =ViewAttributes.FunctionNames.filter((each,index)=>{return ViewAttributes.FunctionActive [index]})

這將根據FunctionActive數組中的 boolean 值過濾數組。