javascript - 如何在 Angular 7 中解析 json?

标签 javascript angular angular7

我的节点 Rest api 有以下输出:

{
    "workorder": [
        {
            "id": 1,
            "Workorderno": 110,
            "Nfno": 23,
            "Amount": 230,
            "Orderno": 34,
            "createdAt": "2019-03-02 00:19:49.495 +00:00",
            "updatedAt": "2019-03-02 12:40:36.647 +00:00"
        }
    ]
}

我想读取输出并使用 Angular 7 将其显示在表格中?有人可以指导我这样做吗?我尝试在我的 REST API 中进行更改,但失败了我可以获得结果

最佳答案

您需要使用 ngFor 进行类似的操作,

<table class="table table-striped">
        <thead>
            <tr>
                <th>Id</th>
                <th>Workorder No</th>
            </tr>
        </thead>
        <tbody>
           <tr *ngFor="let work of data.workorder">
            <td>{{work?.id}}</td>
            <td>{{work?.Workorderno}}</a></td>
           </tr>
        </tbody>
    </table>
</div>

你的界面应该是这样的,

  export interface Workorder {
        id: number;
        Workorderno: number;
        Nfno: number;
        Amount: number;
        Orderno: number;
        createdAt: string;
        updatedAt: string;
    }

然后在你的组件中,

  data : Workorder;
  constructor(private service: nowService) {

  }

  ngOnInit() {
    this.service.getAll().subscribe((data) => {
       this.data = data;
    })
  }
}

关于javascript - 如何在 Angular 7 中解析 json?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54975509/

相关文章:

javascript - Sys.WebForms 在 Chrome 中未定义

css - 有没有一种方法可以在不重新加载 Angular 4 的情况下编写 CSS 样式? #LiveStyle #LiveReload

Angular Material : 'mat-dialog-content' is not a known element

angular - 如何在 isAllselected 函数的数据源中仅获取过滤后的数据,即。 Angular 7 中的复选框列表函数 "isAllSelected"

javascript - 当我创建一个新项目时,angular 7 不会询问是否使用路由

angular - @ViewChild ('tTaskTeam',{ 读取 : MatAutocompleteTrigger }) is not working after upgrading to V8

javascript - 如何将静态变量选择器变成动态变量选择器?

javascript - 如何使用 JQuery 将数据添加到编辑器

php - 使用 jQuery 从数据库循环遍历 JSON

javascript - 使用数据破折号属性进行 Angular 2 表单字段验证