2016-12-07 6 views
2

webpack + angular2 스타터 키트를 사용하고 있습니다.시작 화면. (Angular2)

<app> 
    Loading... 
    </app> 

하지만 대신 "로드"

<app> 
    <splash></splash> 
    </app> 

의 스플래쉬 구성 요소를 사용하고자 할 때 나는 어떤 시작 화면을하지 않았습니다.

누군가 나를 도와 줄 수 있습니까?

+1

어떤 콘솔 오류? 'splash' 컴포넌트가'AppModule'의'declaration'에 포함되어 있습니까? 정확하게 도울 수있는 더 많은 코드가 필요합니다 –

+3

응용 프로그램의 구조에 대한 자세한 정보를 추가 할 수 있습니까? 아주 적은 정보로 문제를 해결하는 것은 매우 어려울 것입니다. 어쩌면 codepen/fiddle 등등을 설치하십시오. – joshvito

+3

만약 내가 당신의 문제를 정확하게 이해한다면, 당신이 시도하고있는 것이 제대로 작동 할 것이라고 생각하지 않습니다. 해당 슬래시 요소가 angular2 구성 요소 인 경우 번들이로드 될 때까지 존재하지 않으며 그 시점에서 내부의 내용이 실제 앱으로 대체됩니다. 앱로드 전에 표시하려면 표준 HTML/인라인 CSS로 시작을 만들 수 있습니다. –

답변

0

내 구현 : 응용 프로그램이 작업을 시작하기 전에

<app> 

    <div class="splashPage"> 
    <div class="splashHeader"> 
     Please wait, we are preparing unTill WM for you. <br> 
     Just few moments left. 
    </div> 
    <div class="spinner"> 
     <img id="logo" src="../assets/img/Logo_112x112.png" /> 
     <img id="spinnerCircle" src="../assets/img/spinner.png" /> 
    </div> 
    <div class="splashFooter"> 
     <div class="mobileLabel">Available on</div> 
     <div class="mobileApps"> 
       <img src="../assets/img/Apple.png"/> 
       <img src="../assets/img/Android.png"/> 
       <img src="../assets/img/Windows.png"/> 
     </div> 

    </div> 
    </div></app> 

시작 화면이 표시됩니다.

또한 머리에 CSS를 추가 :

<link href="assets/css/splash.css" rel="stylesheet" type="text/css" />