angularjs 四

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;
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!