코너 UI - 라우터 기본 상태 문제

Question

나는이 같은 일을 설치 각도 루트/상태에 노력하고있어

:

이

/homepage 
    defaultstate: homepartial.html 

/projects 
    defaultstate: projectHome.html 

/projects/editProject 
    url: projectForm.html 

그래서 전망이처럼 끝날 것 (의사) :

Home: 
    index.html (includes site header and navbar) 
     main view ---> home-partial.html 

myProjects: 
    index.html 
     main view ---> projectHome.html 
          main view ---> project-home-partial.html (shows list of projects) 

editProject: (clicking on a project on projectHome.html) 
    index.html 
     main view ---> projectHome.html 
          main view ---> projectForm.html 

나는 이것을 구현하기 위해 중첩 된 상태를 만들려고 노력하고 있지만 어떻게 작동하는지 완전히 알지 못하는 것 같습니다. 표준 홈 경로가 작동하는 순간

.config(function ($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) { 
$urlRouterProvider.otherwise('/'); 

    $stateProvider 
     .state('/', { 
      url: '/', 
      controller: 'org.mi.novum.controllers.NovumBaseCtrl', 
      views: { 
       '': { 
        templateUrl: 'app/main/main.html' 
       }, 
       'main@/': { 
        templateUrl: 'app/main/home-partial.html', 
        views: { 
         'myProjects@main@/': { 
          url: '/myProjects', 
          templateUrl: 'app/project/myProjects.html' 
         } 
        } 
       } 
      } 
     }) 

, 그것의 홈 부분 중첩와 인덱스 페이지를 보여주는 : 여기 내 라우팅 설정입니다. 그러나 링크를 클릭하여 myProjects 페이지로 이동하면 오류가 발생하지 않으며 아무 일도 일어나지 않습니다. a는 >

나는 무엇을 추측/ < 클래스 = "BTN BTN-차 BTN-LG"역할 = "버튼"UI-(SREF) = > 내 프로젝트 < "myProjects."

링크는 다음과 같습니다 내가하는 일은 "editProject"와 같은 라우트를 정의하는 것입니다. 궁극적으로 /index.html -> myProjects.html -> EditForm.html로 이어질 것입니다.

내가 원하는 것을 성취 할 수있는 더 좋은 방법이 있는지를 포함하여 어느 방향 으로든 감사하게 생각합니다. 이미있는 UI 뷰 지시했다 나는 각-fullstack 보좌관 생성기에 의해 생성 된 원래의 index.html을 잊었다

1), 나는 '내가 잘못이 일을했다 -

Answer 1

문제 발견 main.html에서 시작하여 기존 프로젝트를 이식하려고 시도하면서 혼란 스러웠습니다. 즉, main.html을 제거하고, ui-view 지시문을 projectsHome.html의 div에 추가 한 다음 아래에 나와있는대로 내 경로를 설정합니다.

2) 나는 또한 때로는 "주"와 "전망"을 융합했습니다. 올바른 개념 : 상태는 EditProject로, 하위보기가 "projectForm.html"로 설정된 ProjectHome 페이지로 이동합니다.

$stateProvider 
     .state('/', { 
      url: '/', 
      templateUrl: 'app/main/home-partial.html', 
      controller: 'org.mi.novum.controllers.NovumBaseCtrl' 
     }) 
     .state('myProjects', { 
      url: '/myProjects', 
      views: { 
       '': { 
        templateUrl: 'app/project/myProjects.home.html' 
       } 
      } 
     }) 
     .state('editProject', { 
      url: '/myProjects/projectEditor', 
      views: { 
       '': { 
        templateUrl: 'app/project/projectForm.html' 
       } 
      } 
     }); 

당신이 우리가 주 화면의 부분적인 가정을 포함 가정에 기본적으로 이동 볼 수 있듯이. 그런 다음 myProjects에 대한 링크를 클릭하면 myProjects.home.html 부분이 기본 하위보기로 포함 된 myProjects 홈으로 이동합니다.

myProjects.home.html에서 렌더링되는 editProject 링크를 클릭하면 editProject 상태로 들어가고 projectForm.html의 기본보기로 projectHome.html 페이지가로드됩니다.