2016-11-03 4 views
0

내 엔터티에 대한 '편집'URL을 만들려고합니다. 따라서 예를 들어 /my-site/entity/1/my-site/entity/1/edit입니다. edit 부분은 주/상위 엔티티 URL의 상태를 토글하는 데 사용됩니다. 내가angular2 자식 경로, 구성 요소 없음

.state("home.entity.edit", { 
    url: "/edit", 
    reloadOnSearch: false 
}) 

즉의 라인을 따라 뭔가를 할 수있는 UI를 라우터에 각 1에서

, 이는 자식 상태가 home.entity 일 것입니다. 그것은 부모 상태가 그것을 처리 할 것이기 때문에 뷰나 컨트롤러를 가지지 않을 것이다. 또한이 상태로 전환하면 리디렉션/컨트롤러 실행과 관련하여 실제로 아무 일도 일어나지 않습니다.

실제로 angular2의 구성 요소 라우터에서이 작업을 수행 할 수 있습니까?

답변

0

, 나는 그것을 구현했지만, 지금은 할 것입니다!

1

예, 라우터 매개 변수를 사용하여 가능합니다. 편집 매개 변수는 optional parameter입니다. ngOnInit에서 요청에서 매개 변수를 읽고 그에 따라 행동합니다. 예제보다 자동화가 약간 적지 만 더 자유롭게 사용할 수 있습니다.

@Injectable() 
class EditModeActivator implements CanActivate { 
    constructor() { } 

    canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
     if (next.url[0].path === "edit") { 
      let data: any = next.parent.data; 
      data.editMode = true; 
     } 

     return true 
    } 
} 

그것은 해킹 '예

{ 
    path: 'view/:id', 
    component: NotesViewComponent, 
    children: [ 
     { 
      path: '', 
      component: null 
     }, 
     { 
      path: 'edit', 
      canActivate: [EditModeActivator], 
      component: null 
     } 
    ], 
    data: { 
     editMode: false 
    } 
} 

다음과 같이

순간
+0

그러나 선택적 매개 변수를 쿼리 조각이 아닌 경로 조각의 일부로 사용하고 싶습니다. – Umair

+0

또는 동일한 경로 (/ edit/: id 및/show/: id)를 동일한 구성 요소로 지정할 수 있습니까? – Boland

+0

라우터의 최신 버전은 매개 변수가 쿼리 문자열이 아닌 경로 단편의 일부인 매트릭스 URL 표기법 (localhost : 3000/heroes; id = 15; foo = foo)을 사용합니다. 꽤 흥미롭고이 문제를 어떻게 해결할 것을 권합니다. –

관련 문제