Question

我正在尝试构建一个Angular入门套件，但是在将服务注入组件时遇到了问题。

这是我的主文件app.ts：

/// <reference path="../typings/angular2/angular2.d.ts" />
import 'zone.js';
import 'reflect-metadata';
import 'es6-shim';

import {Component, View, bootstrap} from 'angular2/angular2';
import { MyService } from './services/sampleService';

@Component({
  selector: 'my-app',
  bindings: [MyService]
})
@View({
  template: `
    <ul>
      <li>{{ appStatus }}</li>
      <li>{{ message }}</li>
    </ul>
  `
})
class MyAppComponent {
  appStatus: string;
  message: string;

  constructor(myService: MyService) {
    this.message = myService.getMessage();
    this.appStatus = 'Application is working.';
  }
}

bootstrap(MyAppComponent);

我的服务：

import { Injectable } from 'angular2/angular2';

@Injectable()
export class MyService {
  message: string;

  constructor() {
    this.message = "Services are working";
  }

  getMessage() {
    return this.message;
  }

}

据我所知（通过回顾其他Angular2样本），这是要走的路;但是，第二次我将myService: MyService及其用法添加到MyAppComponent，该应用程序无法加载。运行时不会抛出错误，编译时也没有错误。

我也尝试从@Injectable课程中删除MyService，但这没有任何区别。它仍然没有加载。我没有在视图中注入组件的问题，所以至少可以这样做。

有什么想法吗？

将服务注入Angular2组件不起作用

0 个答案: