2017-11-21 8 views
-2
import { Component } from '@angular/core'; 
import { Loginservice } from './services/login.service'; 
import { FormGroup, FormControl, Validators } from '@angular/forms'; 
import { Router } from '@angular/router'; 

@Component({ 
    selector : 'app-login', 
    templateUrl : 'user-login.html', 
    styleUrls : ['styles/login-style.css'] 

}) 
export class UserLogin{ 

    public userDetail:any[]; 
    public islogin:boolean; 
    public routers : Router; 
    constructor(private service:Loginservice){ 

    } 
    loginform = new FormGroup({ 
     username : new FormControl('',[Validators.required, Validators.minLength(5)]), 
     password : new FormControl('',[Validators.required, Validators.minLength(5)]) 
    }); 

    get username(){ 
     return this.loginform.get('username'); 
    } 
    get password(){ 
     return this.loginform.get('password'); 
    } 

    getStyle(){ 
     return { 
      'font-size': '11px', 
      'text-align': 'center' 
     }; 
    } 

    authLogin(loginObj){ 

     let username = loginObj.value.username; 
     let password = loginObj.value.password; 
     let postdata = {'username':username, 'password':password}; 
     //console.log(postdata); 
     this.service.validateUser(postdata) 
        .subscribe(
         response => { 
          this.islogin= response.json().status=='1'?true:false; 
          //alert(this.islogin); 
          //console.log(response); 
          this.routers.navigate(['/register']); 
         }, 
         error =>{ 
          alert(error+"asdsadsa"); 
         } 

        ); 

    } 
} 

에있는 URL을 탐색하고 싶습니다. 이것은 내 구성 요소의 코드입니다. 내가 로그인 할 때 공통 헤더 및 꼬리말이있는 다른 구성 요소로 가고 싶습니다. 하지만 어떤 구성 요소로도 이동하지 않고 "정의되지 않은 속성을 '탐색 할 수 없습니다'라는 오류가 발생합니다. 한 가지 더 말하면 로그인/등록을 제외한 각 구성 요소에 공통 머리글 및 바닥 글 파일을 추가하는 방법을 알고 싶습니다. 헤더 내부로그인 후 Angular js (4.4.6)

enter image description here

코드 및 바닥 글은 당신이 원하는대로 표현할 수 :

+0

즉, this.routers는 정의되지 않았습니다. 그 질문에 게시 한 내용을 토대로 말할 수있는 유일한 도움이됩니다. 물론 우리는 그것이 정의 될 수없는 36 가지 이유를 상상할 수 있지만 방금 코드를 게시하면 훨씬 쉬울 것입니다. 거기에 버그가 있습니다. 각도가 없습니다. –

+0

오타 또는 종속성을 가져 오지 않았을 수 있으므로 구성 요소 코드를 게시하십시오. 이 두 가지 가능성은 귀하가 제공 한 코드로 확인할 수 없습니다. –

+0

이제 구성 요소 코드를 게시했습니다. 지금 제발 도와주세요 ... – Irshad

답변

0

그것을 달성하는 가장 좋은 방법은 내가 그랬던 것처럼 아래, 별도의 머리글과 바닥 글 구성 요소를 만드는 것입니다

<div class="footer"> 
<i class="material-icons">&#xE90C;</i>{{copyright}} 
</div> 

import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'footer', 
    templateUrl: './footer.component.html', 
}) 

export class FooterComponent implements OnInit { 
    copyright: string; 
    constructor() {} 

    ngOnInit(): void { 

    this.copyright = 'My Copyright'; 
    return; 

    } 

} 

마찬가지로 헤더 구성 요소를 만들 수 있습니다. 일단 완료되면 선택자 태그를 사용하려면 선택기 태그를 포함 시키십시오 (일반적으로 HTML 태그가 다른 경우).

<body> 
    <div id="wrap"> 
     <div id="content" class="flex-col"> 
      <div> 
       <header></header> 
      </div> 
      <div class="content fluid flex-col"> 
       <My-App></My-App> 
      </div> 
      <div> 
       <footer></footer> 
      </div> 
     </div> 
    </div> 
</body> 
+0

rahul ... 고맙습니다.하지만 역동적으로 만들고 싶습니다. 로그인/등록 후 url을 탐색하는 경우 머리글과 바닥 글이 동일해야합니다. – Irshad

+0

어쨌든 이러한 헤더와 바닥 글을 보유 할 홈 구성 요소가 있어야하며 로그인 한 후 리디렉션됩니다. 을이 홈 구성 요소의 으로 바꾸고 남은 URL을 집의 하위로 표시하면 도움이됩니다. 이런 경우 자녀 경로 지정에 도움이 필요합니까? – Rahul

+0

라훌 감사합니다. 내가 기대했던대로 일하고있다. – Irshad