angularjs - Angular 2通过服务器API加载数据: data.切片错误

标签 angularjs node.js mean-stack ng2-smart-table

我正在尝试使用 Angular2 ng 智能表插件将数据从我的 API 加载到自定义组件。

按照他们的文档 ( https://github.com/akveo/ng2-smart-table/blob/master/src/app/pages/examples/server/basic-example-load.component.ts )

我的组件如下:

import { LocalDataSource } from 'ng2-smart-table';
import { ProductService } from '../../../services/product.service';

export class CategoryItemsComponent implements OnInit {

...
 source: LocalDataSource;

 constructor(private productService: ProductService,
             private flashMessage: FlashMessagesService,
             private router: Router,
             http: Http) {
       this.source = new LocalDataSource();

      this.productService.getProductsOncategory(this.categoryid).subscribe((data) => {
      this.source.load(data);
   });

}

ProductService.ts

getProductsOncategory(category_id) {

let catUrl = "http://localhost:5000/products/getProductsOncategory"
let headers = new Headers();
headers.append('Content-Type', 'application/json');
let catIdObj = JSON.stringify({ category_id: category_id })
return this.http.post(catUrl, catIdObj, { headers: headers })
 .map((response: Response) => response.json())
  .do(data => console.log(JSON.stringify(data)))
  .catch(this.handleError);
}

上面的服务函数中使用的 API 在我的 postman 中运行得很好。

现在我需要将该 API 中的数据加载到我的自定义组件中。

我收到此错误:

ERROR TypeError: this.data.slice is not a function

at LocalDataSource.webpackJsonp.../../../../ng2-smart-table/lib/data-source/local/local.data-source.js.LocalDataSource.getElements (http://localhost:4200/1.chunk.js:22280:30) at LocalDataSource.webpackJsonp.../../../../ng2-smart-table/lib/data-source/data-source.js.DataSource.emitOnChanged (http://localhost:4200/1.chunk.js:22185:14) at LocalDataSource.webpackJsonp.../../../../ng2-smart-table/lib/data-source/data-source.js.DataSource.load (http://localhost:4200/1.chunk.js:22105:14) at LocalDataSource.webpackJsonp.../../../../ng2-smart-table/lib/data-source/local/local.data-source.js.LocalDataSource.load (http://localhost:4200/1.chunk.js:22243:38)

最佳答案

好吧,我通过使用像这样得到它:

source: LocalDataSource;

constructor(private productService: ProductService,
            private flashMessage: FlashMessagesService,
            private router: Router,
            http: Http) 
{
   this.source = new LocalDataSource();
}

onChange(categoryid) {
this.productService.getProductsOncategory(categoryid).subscribe(data => {
  if (data.success) {
    this.source.load(data.products);
    console.log('Products obtained');
  } else {
    console.log('Not obtained!');
  }
});

}

关于angularjs - Angular 2通过服务器API加载数据: data.切片错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45208481/

相关文章:

javascript - 如何在 meanjs 中获取基本 url?

javascript - 输入元素 focus() 不起作用

javascript - 如何在 AngularJS 的单个页面中添加多个 Controller

node.js - 使用功能通过 Node 获取获取数据

node.js - 即使在非常简单的设置中也无法命中 WebStorm 中的任何断点

javascript - 使用 Mongolab 和 Github 的安全方式。

node.js - 我在使用 Node.js 引用 MongoDB 中的嵌套子文档时遇到问题

angularjs - 污染 $scope 对象会影响性能吗?

angularjs - Angular + Laravel 项目的 CORS 问题

mysql - 有没有办法在nodejs中的mysql 'insert'查询中动态设置多个VALUES?