ui.router и несколько представлений не работают

0

Я просто не получаю ui.router и почему мои взгляды не будут отображаться. Я хожу в /manageservices и не получаю ничего, несмотря на содержимое в левом и правом html.

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

<!--/manageservices.html-->
<div ng-controller="ManageServicesCtrl">
    <div ui-view="left"></div>
    <div ui-view="right"></div>
</div>

 <!--/left.html-->
<div ng-controller="ManageServicesCtrl">
left
</div>

<!--/right.html-->
<div ng-controller="ManageServicesCtrl">
right
</div>

Мой конфигурационный файл:

ms.config(function($stateProvider, $urlRouterProvider,$locationProvider) {     
    $stateProvider
    .state('manageservices', {
        url: "/manageservices",
        templateUrl: 'static/app/manage-services/manageservices.html',
        controller: 'ManageServicesCtrl',
        views: {
          'left':  {
            templateUrl: 'static/app/manage-services/left.html',
            controller: 'ManageServicesCtrl'
          },
          'right': {
            templateUrl: 'static/app/manage-services/right.html',
            controller: 'ManageServicesCtrl'
          }
        }//end views 
    })

})

Ниже приведен Firebug. Я получаю 200 на обеих страницах, но контент не отображается.

GET http://127.0.0.1:5000/static/app/manage-services/right.html

304 NOT MODIFIED
        192ms   
angular.min.js (line 93)

GET http://127.0.0.1:5000/static/app/manage-services/left.html

304 NOT MODIFIED
        192ms   
angular.min.js (line 93)




Error: Cannot transition to abstract state 'manageservices'
v/y.transitionTo@http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js:7:16913
v/y.go@http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js:7:16389
D/<.link/</e<@http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js:7:24861
f/m<@http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:146:220
e@http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:43:93
Kf/l.defer/c<@http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:45:491

http://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js
Line 107
  • 0
    Насколько я вижу, у вас есть только 2 подпунктов слева и справа без содержания? Можете ли вы предоставить плункер? Кстати, вы инициализируете ManagedServicesCtrl дважды. Один раз в конфигурации и один раз в HTML.
  • 0
    Привет я обновил по коду, как у меня на самом деле есть и добавил левый и правый HTML
Показать ещё 3 комментария
Теги:

1 ответ

3
Лучший ответ

Свойства переопределения состояния отзыва

Если вы определяете объект views, ваше состояние templateUrl, template и templateProvider будет проигнорировано. Таким образом, в случае, если вам нужен родительский макет этих представлений, вы можете определить абстрактное состояние, содержащее шаблон, и дочернее состояние в состоянии макета, которое содержит объект "views".

Вам нужно создать абстрактного родителя. См. Пример

$urlRouterProvider.otherwise("manageservices");
  $stateProvider
    .state('manageservices', {
      abstract : true,
      templateUrl: 'managedservices.html',
      controller: 'ManageServicesCtrl'
    })
    .state('manageservices.main', {
      url: "/manageservices",
      views: {
        'left': {
          templateUrl: 'left.html',
          controller: 'ManageServicesCtrl'
        },
        'right': {
          templateUrl: 'right.html',
          controller: 'ManageServicesCtrl'
        }
      } //end views 

    })

PS. удалите ng-controller="ManageServicesCtrl" из HTML. Вы уже определили контроллер в конфигурации!

  • 0
    Большое спасибо. Я делаю это получить эту ошибку, хотя. Ошибка: Невозможно перейти в абстрактное состояние 'manageservices' full ставится под сомнение.
  • 0
    Как вы ориентируетесь? Ссылки или JavaScript? Вероятно, вы должны ссылаться на состояние суб. попробуйте $state.go('manageservices.main'); или <a ui-sref="manageservices.main">State 1</a>
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню