代码之家 › 专栏 › 技术社区 › physicsboy

无法正确插入数据-角度材质表-角度2+

angular-material typescript angular javascript

0

physicsboy · 技术社区 · 7 年前

我的数据以以下格式显示:

export const DATA: any = {
  'products': [
    {
      'id': 1,
      'name': 'SOLID BB T-SHIRT',
      'price': '28.00',
      ...
    },
...
]

从Material.angular.io给出的示例来看,它们的数据格式如下:

export const DATA = [
  {
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    ...
  },
  ...
]

<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
   <ng-container matColumnDef="id">
    <th mat-header-cell *matHeaderCellDef> id </th>
    <td mat-cell *matCellDef="let element"> {{element.id}} </td>
  </ng-container>

我有什么遗漏吗?

3 回复 | 直到 7 年前

1

0

Brad Axe 7 年前

当对象需要数组时,您当前正在将数据源指向该对象。所以,简单的实现可能是(in.component.ts):

dataSource = DATA["products"]

2

0

PeS 7 年前

不太清楚,因为您没有提供创建 dataSource 但我猜你是路过 Object 而不是 Array 具有 DATA.products .

3

0

wFitz 7 年前

import { MatTableDataSource } from '@angular/material';

然后将以下内容添加到ngOniInit()中

ngOnInit() {
   this.dataSource = new MatTableDataSource(DATA);
}