组件没有显示在页面上

我得到了一个Angular2项目，由另一个人开发，我需要运行它。当我这样做时，使用npm start我让服务器运行，但名为my-app的组件不在页面上呈现。组件没有显示在页面上

这是index.html：

<html> 
    <head> 
    <base href='/'> 
    <title></title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="styles.css"> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">  
    <link href="c3.css" rel="stylesheet" type="text/css"> 

    </head> 

    <body> 
    <my-app>Loading......</my-app> 
    </body> 
</html>

这是app.components.ts：

import { Component } from '@angular/core'; 
import { AuthenticationService } from './authentication.service'; 
import { Router } from '@angular/router'; 

@Component({ 
    selector: 'my-app', 
    templateUrl: 'app/app.component.html', 
    styleUrls: ['app/app.component.css'] 
}) 

export class AppComponent { 
    title = ''; 
    isProd:boolean; 
    constructor(private authenticationService: AuthenticationService, private router: Router) { 
     this.isProd = false; 
}

在template为my-app，这是app/app.component.html我把一个简单的div来进行测试：

<div><h1>app components</h1></div>

当运行这个我可以看到Loading.....这是在index.html但不是app/app.component.html的内容。

我错过了什么？

来源

2016-12-12 Eddy

检查您的控制台是否有任何错误。 –

我找不到c3.css。 – Eddy

什么是AuthenticationService？我几天前遇到了同样的问题，我不得不在@Componet中添加提供者，并且解决了问题（例如'providers：[AuthenticationService]'） –

我看不到你是否在index.html中的任何地方加载角度和你的转换后的ts。您需要在index.html中加载运行angular2应用程序所需的全部依赖项，并且还要加载您的转发ts。

注意： - 您需要将所有链接到加载css后的基本标记。

<title></title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="styles.css"> 
     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">  
     <link href="c3.css" rel="stylesheet" type="text/css"> 
    <base href='/'>

来源

2016-12-12 13:18:23

你是如何加载所有需要的依赖关系的？我正在看这个例子，https://embed.plnkr.???show=preview，并且index.html文件中没有任何东西可以执行加载角度任务。 – Eddy

@Eddy我看不到任何角度加载在这个运动员？ [看看这个种子]（https://github.com/blinfo/angular2-webpack-seed） –

组件没有显示在页面上

回答

相关问题