文章/答案/技术大牛

发布

社区首页 >问答首页 >角度2错误-令牌实例化过程中出错(Promise<ComponentRef>)！

问角度2错误-令牌实例化过程中出错(Promise<ComponentRef>)！
EN

Stack Overflow用户

提问于 2015-09-13 10:56:31

回答 1查看 1K关注 0票数 1

我是新的角度世界。目前正在学习中，遵循他们的文档从"https://angular.io/docs/ts/latest/guide/displaying-data.html“。现在，我已经坚持了一点。

我有两份文件。I- show-properties.html

<!DOCTYPE html>
<html>
    <head>
        <script src="../node_modules/traceur/bin/traceur-runtime.js"></script>
        <script src="../node_modules/es6-module-loader/dist/es6-module-loader.js"></script>
        <script src="../node_modules/systemjs/dist/system.src.js"></script>
        <script src="../node_modules/angular2/bundles/angular2.dev.js"></script>
    </head>

    <body>
        <display></display>

        <script>
            System.import('show-properties');
        </script>
    </body>
</html>

ii - show-properties.ts

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

@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]
})

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

    // constructor() {
    //  this.myName = "Alice";
    //  this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
    // }

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


class FriendsService {
    names: Array<string>;
    constructor() {
        this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];
    }
}

bootstrap(DisplayComponent);

当我执行这个时，它工作得很好，但是，当我注入'FriendsService‘类，通过做以下更改来为模型提供朋友列表的时候-

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

    // constructor() {
    //  this.myName = "Alice";
    //  this.names = ["Aarav", "Martín", "Shannon", "Ariana", "Kai"];
    // }

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

我在我的chrome控制台上得到了下面的错误。

有没有人能帮我弄清楚这里出了什么问题。

typescript

angular

回答 1

Stack Overflow用户

发布于 2015-09-13 17:09:55

appInjector was removed in alpha-29.现在您必须使用bindings和viewBindings，而不是它：

@Component({
  selector: 'display',
  bindings: [FriendsService]
})
@View({
  // view ...
})
class DisplayComponent { /* component ... */ }

This plunker运行得很好。

票数 3

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/32545867

复制

相似问题

问角度2错误-令牌实例化过程中出错(Promise<ComponentRef>)！
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问角度2错误-令牌实例化过程中出错(Promise<ComponentRef>)！EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问角度2错误-令牌实例化过程中出错(Promise<ComponentRef>)！
EN