AngularJS 하위보기 페이지 라우팅 개념을 어떻게 달성 할 수 있습니까?

Question

라우팅 관련 질문이 있습니다. 질문에 대한 첫 번째 답을 샘플 Image에 첨부했습니다.

ng-view 태그가있는 단일 페이지 앱이 있습니다. Under-view에는 Link1, Link2 및 Link3의 3 가지 링크가 있습니다. 각 링크를 클릭하면 화면 오른쪽의보기에 결과 만 표시됩니다. 내 URL도 변경하고 싶습니다 (예 : websitename/home/link1, websitename/home/link2, websitename/home/link3). 기본 URL은 websitename/home입니다. 링크를 변경하는 동안 왼쪽 사이드 패널을 새로 고침하고 싶지 않습니다.

어떻게 AngularJS로이 기능을 사용할 수 있습니까? ngInclude/ngDirectives/ngview/ngSwitch를 사용해야합니까? 나는 전혀 모른다. 온라인 자습서에서 동일한 응용 프로그램에 여러 개의 ng-view 태그를 사용하면 안된다는 것을 알게되었습니다. 사실입니까?

또한 내 머리글에 페이지 탐색이 많기 때문에 오른쪽보기로 이동할 수 없습니다. 이보기는 그 중 하나입니다.

Answer 1

부모 URL에 대한 하위 URL을 작성한 다음 해당 하위 URL에 대한 액세스가 상위 URL 뷰에서 렌더링 될 수 있도록 해당 하위 URL에 액세스해야합니다. 이 경우 ui.router 모듈을 사용할 수 있습니다. 예 :

$ stateProvider.state ({ 이름 : "부모 -보기" URL : "/ parentView" templateUrl "템플릿/parentView.html" });

$ stateProvider.state ({ 이름 : "부모 - 자식 뷰", URL : "/ childView" templateUrl "템플릿/childView.html" 부모 : "부모 -보기" });

컨트롤러에서 $ state.transitionTo ("parent-child-view");를 호출해야합니다.