2017-04-21 2 views
0

View Job을 클릭하면 페이지가 마스터 세부 정보로 이동 한 후 path : '', component : JobsComponent로 빠르게 이동합니다. 내가 마스터 세부 사항에 보기 작업 버튼을 실행하는 곳 아래로 아래에서 enter image description here enter image description here enter image description here 입니다Angular2 Routing 해결 경로 : ''on Master Detail

이 코드가 성공적으로 얻을 수

const appRouts: Routes = [ 

    { 
    path: '', 
    component: JobsComponent 
    }, 
    { 
    path: 'learner', 
    component: LeanershipsComponent 
    } { 
    path: 'cvTips', 
    component: CvTipsComponent 
    }, 
    { 
    path: 'detail/:id', 
    component: JobDetailComponent 
    } 
] 
<table *ngFor="let l of getKeys()" class="table"> 
    <tr class="odd hide-jobs"> 
    <td class="tbl-logo"><img src="assets/img/job-logo5.png" alt=""></td> 
    <td class="tbl-title"> 
     <h4> {{jobs[l].title}}<br><span class="job-type">full time</span></h4> 
    </td> 
    <td> 
     <p>{{jobs[l].company}} </p> 
    </td> 
    <td> 
     <p><i class="icon-location"></i>{{jobs[l].location}}</p> 
    </td> 
    <td> 
     <p>{{jobs[l].salary}}</p> 
    </td> 
    <td routerLink="./detail/{{l}}" class="tbl-apply"><a href="">View Job</a></td> 
    <td class="tbl-apply"><a href="">Apply now</a></td> 
    </tr> 
</table> 

세부 사항에 지적 마스터 상세 경로가

라우팅 파일 firebase의 ID가 루프에 전달됩니다. *ngFor

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

@Component({ 
    selector: 'app-jobs', 
    templateUrl: './jobs.component.html', 
    styleUrls: ['./jobs.component.css'], 
    providers: [Service] 
}) 
export class JobsComponent { 

    jobs 
    key = [] 
    constructor(private todoService: Service) { 

    let promise = todoService.getJobs(); 
    promise.then(snapshot => { 
     this.jobs = snapshot.val(); 
     var listJobs = snapshot.val(); 
     // console.log(listJobs); 
    }) 
    this.getKeys(); 

    } 
    ngAfterViewInit() { 
    this.getKeys(); 
    } 
    getKeys() { 
    try { 
     this.key = Object.keys(this.jobs); 
     //console.log(this.key); 
    } catch (e) { 
     // console.log(e);  
    } 
    return this.key; 
    } 

} 

답변

0

앵커 태그에서 href=""을 제거하십시오. 문제를 해결해야합니다.

+0

감사합니다. 부주의 한 실수 –

관련 문제