无法使用角度和本地json文件创建数据表

Question

我开始学习有角度的知识。我正在尝试使用其他语言在其他项目中使用的数据表库。通过阅读此处的文档：https://l-lin.github.io/angular-datatables/#/basic/with-ajax。但是我还没有设法访问静态json文件中的信息。

import { Component,  OnInit } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
  dtOptions: DataTables.Settings = {};

  ngOnInit(): void {
    this.dtOptions = {
      ajax: 'data/data.json',
      columns: [{
        title: 'ID',
        data: 'id'
      }, {
        title: 'First name',
        data: 'firstName'
      }, {
        title: 'Last name',
        data: 'lastName'
      }]
    };
  }
}

问题出在ajax调用中（我认为），但是我尝试过：

'./data/data.json'
'..data/data.json'
'data/data.json'

html

<table datatable [dtOptions]="dtOptions" class="row-border hover"></table>

控制台：

还有很多其他事情，但我无法得出结果，这是我第一次花这么多时间用这个库来解决问题：（

Answer 1

在这种情况下，使用angular-cli时，在运行时（使用ng serve命令将找不到该文件位置。

您必须将json文件放入资产文件夹中，并且路径应如下所示：

assets/data/data.json

请检查以下屏幕截图：