如何修复“找不到其他支持对象”

时间:2019-06-17 12:12:40

标签: node.js angular

我想显示mySql表中的日期。

我有从数据库实际表中获取的api。

这是我的服务(auth.service.ts)

getAliases(): any {
    this.loadToken();
    const headers = new HttpHeaders({
      Authorization: this.authToken,
      'Content-Type': 'application/json'
    });
    return this.http
      .get('http://localhost:8080/aliases/aliases', { headers: headers })
      .pipe(map(res => res));
  }

这是我的aliases.js

router.get('/aliases', function (req, res) {
    con.query('SELECT * FROM virtual_aliases', function (error, results, fields) {
        if (error) throw error;
        return res.send({ error: false, data: results, message: 'aliasy.' });
    });
});

这是我的component.ts

import { Component, OnInit } from '@angular/core';
import { AuthService } from 'app/services/auth.service';
import { Router } from '@angular/router';

@Component({
  selector: 'app-dashboard',
  templateUrl: './dashboard.component.html'
})
export class DashboardComponent implements OnInit {
  aliases: any = {};

  constructor(private authService: AuthService, private router: Router) { }

  ngOnInit() {

    this.getAliases();
  }

   getAliases() {
    this.authService.getAliases().subscribe(
      res => {
        this.aliases = res;
        console.log(this.aliases);
      },
      err => console.error(err)
    );
  }
}

和我的component.html

<table border='1' width='100%' style='border-collapse: collapse;'>
    <tr>
      <th>ID</th>
      <th>DOMAIN_ID</th>
      <th>SOURCE</th>
      <th>DESTINATION</th>

    </tr>

    <tr *ngFor="let aliases of aliases">
      <td>{{ id }}</td>
      <td>{{ domain_id }}</td>
      <td>{{ source }}</td>
      <td>{{ destination }}</td>
      <td>
      </td>
    </tr>
  </table>

我想显示我桌子上的所有东西。

我的Api的输出类似于Json:

{
  "error": false,
  "data": [
    {
      "id": 1,
      "domain_id": 1,
      "source": "test@testone.com",
      "destination": "dest@testone.com"
    },

控制台出现错误

DashboardComponent.html:7 ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

1 个答案:

答案 0 :(得分:2)

您需要访问响应的data属性,该属性是一个数组,

this.aliases = res.data;