Angular 2 DataService in TypeScript for ASP.NET 5 not displaying data -


this displays hello world app.component.ts bootstrapping correctly. either no data returned dataservice or can't displayed. there no compiler errors. there popup window in typescript alert() in javascript check see if data being returned dataservice?

app.component.ts

import { component } 'angular2/core'; import { dataservice } './data.service';  @component({    selector: 'app',   template: `<h1>hello world</h1> <li *ngfor="#customer of customers">   <span>{{customer.firstname}}</span>  </li> ` }) export class appcomponent {     public dataservice: dataservice;     customers: any[];     constructor() { }     ngoninit() {         this.dataservice.getcustomers()             .subscribe((customers: any[]) => {                 this.customers = customers;             });     } } 

data.service.ts

import { injectable } 'angular2/core'; import { http, response } 'angular2/http'; import 'rxjs/add/operator/map';  @injectable() export class dataservice {     public http: http     constructor() { }      getcustomers() {         return this.http.get('customers.json')             .map((res: response) => res.json());     } } 

you need register dataservice 1 of providers component.

import { component } 'angular2/core'; import { dataservice } './data.service';  @component({    selector: 'app',   providers: [dataservice],    template: `<h1>hello world</h1> <li *ngfor="#customer of customers">   <span>{{customer.firstname}}</span>  </li> ` }) export class appcomponent {      customers: any[];      constructor(public dataservice: dataservice) { }      ngoninit() {         this.dataservice.getcustomers()             .subscribe((customers: any[]) => {                 this.customers = customers;             });     } } 

Comments

Popular posts from this blog

c++ - llvm function pass ReplaceInstWithInst malloc -

java.lang.NoClassDefFoundError When Creating New Android Project -

Decoding a Python 2 `tempfile` with python-future -