Question

我已经编写了这样的服务代码来从后端读取

getData(): any { 

    let headers = new Headers(
      {

      });
    let options = new RequestOptions({ headers: headers });

    return this.httpClient.get('https://link', options)
      .map((res: Response) => res.json())
      // .do(data => console.log('All data: ' + JSON.stringify(data)))
      .catch((error: any) => Observable.throw(error.json().error || 'Server error'));

和加载数据的代码

ngOnInit() {
    this.service.getData().subscribe(
      (res) => {this.Data = res},
      (error) => this.errorMessage = <any>error);
}

但是在视图加载后它会获取数据，因此它会给出错误。

如何在加载视图之前加载数据？

Answer 1

最好的选择是使用Routeresolver。解析器是路由定义的一部分，旨在在激活路由之前提供数据。因此，如果显示视图，您可以在ngOnInit中获取提供的数据。您只需使用代码来获取解析器中的数据

Enter multiple lines, press Ctrl-D after last line:
1 10
100 200
201 210
900 1000
4 lines of data have been received.
>>> Array
[[1, 10], [100, 200], [201, 210], [900, 1000]]
>>>

在组件中： export class BesuchdetailComponent {

import { Injectable } from '@angular/core';
import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { DataService } from './DataService';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class MyDataResolve implements Resolve<any> {

    constructor(private dataService: DataService) { }

    resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any>|Promise<any>|any     {

        let id = +route.params['id'];
        return this.dataService.getRecords('MT_Entity', id);    
    }
}

添加路由器定义：

   ngOnInit(): void {
     // Initialize form values, Prepare for SELECTS, ...
     let rawdata: any;
     this.rawbobject = this.route.snapshot.data['myobject'];
   }
 }

Answer 2

Angular 2是一个使用类的Java和C ++的OOP。我建议你开始在服务文件中使用类。以下链接是您可能正在寻找的解决方案。希望这可以帮助。快乐的编码..

  def create
    @note = @notable.notes.new(note_params)
    @note.save
    respond_to do |format|
      format.js
    end
  end

Angular2在视图加载之前从后端加载数据

2 个答案: