组件未显示在页面上

时间:2016-12-12 13:07:02

标签: node.js angular npm

我有一个由不同的人开发的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.htmldiv我将一个简单的<div><h1>app components</h1></div> 用于测试:

Loading.....

运行此功能后,我可以看到index.html中的app/app.component.html,而不是a = A*sin(wt) b = B*sin(wt+d) [c, time_c] = xcorr(a,b) [m, i_m] = max(c) d_ext = time_c(i_m) * T * w % T is the sampling time 的内容。

我错过了什么?

1 个答案:

答案 0 :(得分:0)

我无法看到你是否在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='/'>