구성 요소가 페이지에 표시되지 않습니다.

다른 사람이 개발 한 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입니다 :

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

: 나는 테스트를 위해 간단한 div을 넣어 app/app.component.html입니다 my-app에 대한 template에서는

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; 
}

이걸 실행할 때 은 index.html에 있지만 app/app.component.html의 내용은 볼 수 없습니다.

무엇이 누락 되었습니까?

출처

2016-12-12 Eddy

는 오류 콘솔을 확인합니다. –

c3.css를 찾을 수 없습니다. – Eddy

AuthenticationService 란 무엇입니까? 며칠 전 동일한 문제가 발생하여 @Componet에 제공자를 추가해야했지만 문제가 해결되었습니다 (예 : providers : [AuthenticationService]) –

각도가로드되어 있고 transpiled ts는 index.html의 어느 위치에 있는지 알 수 없습니다. index.html에서 angular2 app 실행에 필요한 모든 필수 항목을로드해야하며, 모두 transpiled ts를 모두로드해야합니다.

참고 : - load 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.co/?show=preview이고로드 각도 작업을 수행하는 것으로 보이는 index.html 파일에는 아무것도 없다. – Eddy

@Eddy이 플 런커에 각도 로딩이 보이지 않습니까? [이 씨앗을 보아라] (https://github.com/blinfo/angular2-webpack-seed) –

구성 요소가 페이지에 표시되지 않습니다.

답변

관련 문제