无法从 angular InMemoryDbService 中获取任何信息

Question

所以我完成了 Angular 4 英雄教程，我想我已经准备好了。所以我创建了自己的项目，并想为自己尝试一些东西。不幸的是失败了。

我想做什么：我想使用内存数据库从中检索数据。在我的内存数据库中，我存储了一个学期数组，当我的 getSemesters() 使用此端点被调用时，我希望将其作为学期数组 return：api/semesters。然后我想在列表中显示数据。不幸的是，该列表 未显示 （或以某种方式加载）。

我试图通过阅读一些文档和文档来研究这个问题：https://github.com/angular/in-memory-web-api 文档描述内存数据库假定有一个 ID。由于某些原因，我的学期对象不会使用 ID 字段。所以我想知道这可能是我的问题。在那种情况下，我将跳过使用内存数据库。

有人 tips/improvements/explanations 了解我的问题吗？

这是内存数据服务（我切掉了其他行以使其更小）：

import { InMemoryDbService } from 'angular-in-memory-web-api';
export class InMemoryDataService implements InMemoryDbService {
  createDb() {
    const semesters = [
      { 'semester': 1,
      'modules': [
        {'module_code': 'JAV1',
         'module_name': 'Programming in Java 1',       
          'credits': 5 },
        ]}
    ];
    return {semesters};
}

我的学期class:

import {Module} from './module';
export class Semester {
  semester: number;
  modules: Module[];
}

我的模块class:

export class Module{
  module_code: string;
  module_name: string;
  credits: number;
}

我的后端-mockup.service:

@Injectable()
export class BackendMockupService {
  private headers = new Headers({'Content-type': 'application/json'});
  private semestersUrl = 'api/semesters';

  constructor(private http: Http) { }

  getSemesters(): Promise<Semester[]> {
    this.http.get(this.semestersUrl)
      .toPromise()
      .then(response => response.json().data as Semester[])
      .catch(this.handleError);
    return null;
  }


  private handleError(error: any): Promise<any> {
    console.error('An error occurred', error); // for demo purposes only
    return Promise.reject(error.message || error);
  }
}

我的 app.component.ts 文件：

@Component({
  selector: 'app-fmms',
  templateUrl: './app.html',
  styleUrls: ['./app.scss']
})
export class AppComponent implements OnInit {
  semesters: Semester[];

  constructor( private bms: BackendMockupService) {}

  getSemesters(): void {
    this.bms.getSemesters().then(semesters => this.semesters = semesters);
  }

  ngOnInit(): void {
    this.getSemesters();
  }
}

HTML片段：

 <ul>
   <li *ngFor="let semester of semesters">
     <span>{{semester.semester}}</span>
   </li>
 </ul>

最后但并非最不重要的 app.module.ts 文件：

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    HttpModule,
    UtilModule,
    AppRoutingModule,
    LoginModule,
    StartModule,
    InMemoryWebApiModule.forRoot(InMemoryDataService)
  ],
  providers: [ BackendMockupService],
  bootstrap: [AppComponent]
})

亲切的问候，

感谢所有帮助。

Answer 1

在后端模型服务 null 中 returned。 return null 应该被删除，第一个语句应该是 returned.

 getSemesters(): Promise<Semester[]> {
    return this.http.get(this.semestersUrl)
      .toPromise()
      .then(response => response.json().data as Semester[])
      .catch(this.handleError);
 }

无法从 angular InMemoryDbService 中获取任何信息

cant get anything out of angular InMemoryDbService

json

angular

http

service

in-memory-database