Question

我是Angular 2的新手，在绑定某些JSON数据时遇到问题。如果我在新标签页中运行API网址，则可以看到返回的JSON，而不仅仅是通过我的应用程序。以下是我的服务，组件和查看文件。

Service.ts

 public permission(module: string): Observable<Permissions[]> {
    return this.http
    .get('api-url')
    .map((response: Response) => {
       return <Permissions[]>response.json();
       })
}

Component.ts

_permissionsView: Permissions[];

ngOnInit() {
    this.getPermissions();
}

getPermissions() {
    this._commonService.permission('module')
    .subscribe(
        resultsArray => {
            this._permissionsView = resultsArray;
            console.log(this._permissionsView);
        },
        error => {"Error: " + error }
    )
}

Component.html

<kendo-grid [kendoGridBinding]="_permissionsView">
            ....
</kendo-grid>

我订阅不正确吗？

Answer 1

这对我有用：

在服务中

constructor( private http: HttpClient ) {}

getPermissions( params ) {

   const headers = new HttpHeaders()
      .set('Content-Type', 'application/json')
      .set('Accept', 'application/json')

   const url = 'http://localhost:5000/api/'  

   return this.http.get(
      url + 'permissions',
      { headers: headers }
   );        
}

在控制器中

this.dataService.getPermissions(param).subscribe( 
   data => {
      console.log('data OK !');
      console.log(data);
      this._permissionsView = data;
   },
   error => {
      console.log('data error !');
   }
);

我不知道kendo网格对dataSource的期望是什么，您是否尝试过使用* ngIf =“ _ permissionsView”将div中的“ kendo网格选择器”包装起来？因此它会在您的http调用完成后呈现。

Answer 2

这是我刚刚使用Kendo UI编写的一个有效示例。

它模拟Web api调用，返回延迟为1000的可观察对象

https://stackblitz.com/edit/angular-kendo-datagrid-example

Angular 2-无法绑定来自HTTP Get请求的数据

2 个答案: