Angular：如何使用appInject注入服务到组件中？

Question

我跟随谷歌的angular2 quick start（这些例子没有Github ?!）

一切工作顺利，直到是时候注入服务。

这是我的代码：

import {Component, View, bootstrap, NgFor} from 'angular2/angular2'; 

class FriendsService { 
    names: Array<string>; 

    constructor(){ 
     this.names = ['Aviad', 'Chen', 'Yarden']; 
    } 
} 

@Component({ 
    selector: 'display', 
    appInjector: [FriendsService] 
}) 
@View({ 
    template: 
    <p>My name: {{ myName }}</p> 
    <p>Friends:<p> 
    <ul> 
     <li *ng-for="#name of names"> 
      {{name}} 
     </li> 
    </ul> 
    , 
    directives: [NgFor] 
}) 

export default class DisplayComponent { 
    myName: string; 
    names: Array<string>; 

    constructor(friendsService: FriendsService){ 
     this.myName = 'Alice'; 
     this.names = friendsService.names; 
    } 
} 

我遇到了很多例外情况，但第一个和我认为是最相关的是：

可能相关

EXCEPTION: No provider for FriendsService! (DisplayComponent -> FriendsService) angular2.dev.js:22367 STACKTRACE: angular2.dev.js:22367 Error: DI Exception 

    at NoBindingError.BaseException (angular2.dev.js:7735) 
    at NoBindingError.AbstractBindingError (angular2.dev.js:9029) 
    at new NoBindingError (angular2.dev.js:9052) 
    at Injector.execute._proto._throwOrNull (angular2.dev.js:27552) 
    at Injector.execute._proto._getByKeyDefault (angular2.dev.js:27597) 
    at Injector.execute._proto._getByKey (angular2.dev.js:27545) 
    at Injector.execute._proto._getByDependency (angular2.dev.js:27533) 
    at Injector.execute._proto._instantiate (angular2.dev.js:27430) 
    at Injector.execute._proto._new (angular2.dev.js:27403) 
    at InjectorInlineStrategy.execute.protoStrategy.instantiateBinding (angular2.dev.js:27192) angular2.dev.js:22367 ERROR CONTEXT: 

一件事是<display>组件是<my-app>组件的指令：

import {Component, View, bootstrap} from 'angular2/angular2'; 
import DisplayComponent from './show-properties'; 

@Component({ 
    selector: 'my-app' 
}) 
@View({ 
    template: '<display>', 
    directives: [DisplayComponent] 
}) 
class AppComponent { } 

bootstrap(AppComponent); 

Answer 1

这样做：

@Component({ 
    selector: 'display', 
    bindings: [FriendsService] // instead of appInjector 
}) 

当其他东西保持与上述相同。

反正根据changelog这是一个重大更改（感谢jesse Good）：

重大更改

的appInjector属性已被删除。相反使用viewInjector或hostInjector。

我想Angular2快速入门指南并不像我想的那样是最新的。