Angular 2 组件未显示

Question

我有以下组件，当我的路由器路由到该组件时，我得到以下屏幕：

组件如下：

import { Component } from 'angular2/core';
import { Router } from 'angular2/router';
import { UserService } from '../services/user.service';

@Component({
  selector: 'login',
  template: 'client/dev/user/templates/login.html',
  styleUrls: ['client/dev/todo/styles/todo.css'],
  providers: []
})
export class LoginComponent {
  constructor(
    private userService: UserService, 
    private router: Router
  ) { }

  onSubmit(email, password) {
    this.userService.login(email, password).subscribe((result) => {
      if (result) {
        this.router.navigate(['Home']);
      }
    });
  }
}

为什么这个渲染不正确？

注意：如果我更改路由以使用不同的组件，它工作正常，所以我认为它是这个特定的组件，或者可能是一些依赖性问题。

Answer 1

您需要在 Component 装饰器中使用 templateUrl 而不是 template：

@Component({
  selector: 'login',
  templateUrl: 'client/dev/user/templates/login.html', // <-----
  styleUrls: ['client/dev/todo/styles/todo.css'],
  providers: []
})
export class LoginComponent {
  (...)
}

Angular 2 组件未显示

Angular 2 Component not displaying

angularjs-routing

angular