import {Component} from 'angular2/core'; import {HeroDetailComponent} from './hero-detail'; import {Hero} from './hero'; import {HeroService} from './hero-service'; @Component({ selector: 'appTest',template: ` <h4 >下面是providers内容</h4> <ul> <li *ngFor="#hero of heroes"><span>{{hero.id}}</span>{{hero.name}}</li> </ul> `,providers: [HeroService] }) export class App { constructor(private _heroService: HeroService) { } public heroes = this._heroService.getHeroes(); }
/** * Created by dell on 2016/9/8. */ import {Injectable} from 'angular2/core'; import {HEROES} from './mock-heroes'; @Injectable() export class HeroService { getHeroes() { return HEROES; } }
/** * Created by dell on 2016/9/8. */ import {Hero} from './hero'; export var HEROES: Hero[] = [ { "id": 11,"name": "苹果手机" },{ "id": 12,"name": "亚马逊" },{ "id": 13,"name": "谷歌" },{ "id": 14,"name": "Facebook" },{ "id": 15,"name": "雅虎" },{ "id": 16,"name": "阿里巴巴" },{ "id": 17,"name": "淘宝网" },{ "id": 18,"name": "京东" },{ "id": 19,"name": "小米" },{ "id": 20,"name": "腾讯" } ];
/** * Created by dell on 2016/9/8. */ export interface Hero { id: number; name: string; }原文链接:https://www.f2er.com/angularjs/148898.html