2014-10-19 4 views
1

Я пытаюсь установки угловых маршрутов/состояний, которые работают так:Угловая UI-маршрутизатор по умолчанию Государственного Issue

(псевдокод)

/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' 
       }, 
       '[email protected]/': { 
        templateUrl: 'app/main/home-partial.html', 
        views: { 
         '[email protected]@/': { 
          url: '/myProjects', 
          templateUrl: 'app/project/myProjects.html' 
         } 
        } 
       } 
      } 
     }) 

В настоящее время стандартный домашний маршрут работает, показывая индексную страницу с домом-частичной вложенным в него. Но когда я нажимаю ссылку, чтобы перейти на страницу myProjects, она не работает - никаких ошибок, просто ничего не происходит.

Ссылка выглядит следующим образом: "MyProjects" < класс = "BTN BTN первичной БТН-Л.Г." Роль = "Кнопка" UI-sref = > Мои проекты </а >

Я думаю, что Я пытаюсь определить маршруты, такие как «editProject», которые в конечном итоге приведут к /index.html -> myProjects.html -> EditForm.html, если это имеет смысл.

Любое направление будет высоко оценено, в том числе есть ли лучший способ достичь того, чего я хочу.

ответ

0

Нашли проблему - я делаю две вещи неправильно:

1) Я забыл первоначальный index.html порожденное угловой fullstack генератора YEOMAN уже директиву щ ракурса в нем, и я d запутался во время попытки переноса существующего проекта, начиная с main.html. Короче говоря, я избавился от main.html, добавил директиву ui-view в div на projectsHome.html, а затем настроил мои маршруты, как показано ниже.

2) Я также время от времени конфликтовал «состояния» и «взгляды». Правильная концепция: состояние EditProject, которое выводит нас на страницу ProjectHome с подзадачей, установленной в «projectForm.html».

$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, а часть myProjects.home.html частично включается в качестве суб-представления по умолчанию.

Когда мы нажимаем ссылку editProject, которая отображается в файле myProjects.home.html, она возвращает нас в состояние editProject, которое загружает страницу projectHome.html с представлением по умолчанию projectForm.html по умолчанию.

Смежные вопросы