Angularjs ui.router和多个视图不工作_Angularjs

Angularjs ui.router和多个视图不工作

angularjs

Angularjs ui.router和多个视图不工作,angularjs,Angularjs,我只是不了解ui.router以及为什么我的视图不会显示。我转到/manageservices，尽管内容是左html和右html，但什么也得不到我希望在我的页面中显示左视图和右视图  <div ng-controller="ManageServicesCtrl"> <div ui-view="left"></div> <div ui-view="right"><

我只是不了解ui.router以及为什么我的视图不会显示。我转到/manageservices，尽管内容是左html和右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>

下面是萤火虫。我在两个页面上都得到了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

GEThttp://127.0.0.1:5000/static/app/manage-services/right.html
304未修改
192ms
angular.min.js（第93行）
得到http://127.0.0.1:5000/static/app/manage-services/left.html
304未修改
192ms
angular.min.js（第93行）
错误：无法转换到抽象状态“manageservices”
是的。transitionTo@http：//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js:7:16913
是的。go@http：//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js:7:16389
D/

如果定义视图对象，则状态的templateUrl、template和
templateProvider将被忽略。所以如果你需要一个
在这些视图的父布局中，可以定义
包含模板和布局状态下的子状态
包含“视图”对象
您需要创建一个抽象父级。看
另外，从HTML中删除ng controller=“ManageServicesCtrl”
。您已经在配置中定义了控制器

如果定义视图对象，则状态的templateUrl、template和
templateProvider将被忽略。所以如果你需要一个
在这些视图的父布局中，可以定义
包含模板和布局状态下的子状态
包含“视图”对象
您需要创建一个抽象父级。看
另外，从HTML中删除ng controller=“ManageServicesCtrl”
。您已经在配置中定义了控制器

如果定义视图对象，则状态的templateUrl、template和
templateProvider将被忽略。所以如果你需要一个
在这些视图的父布局中，可以定义
包含模板和布局状态下的子状态
包含“视图”对象
您需要创建一个抽象父级。看
另外，从HTML中删除ng controller=“ManageServicesCtrl”
。您已经在配置中定义了控制器

如果定义视图对象，则状态的templateUrl、template和
templateProvider将被忽略。所以如果你需要一个
在这些视图的父布局中，可以定义
包含模板和布局状态下的子状态
包含“视图”对象
您需要创建一个抽象父级。看
另外，从HTML中删除ng controller=“ManageServicesCtrl”
。您已经在配置中定义了控制器
 据我所知，你只有两个子视图左右没有内容？你能提供一个打劫器吗？顺便说一句，您确实初始化了ManagedServicesCtrl
两次。一次在配置中，一次在html中。嗨，我用代码更新了我的实际拥有情况，并添加了左侧和右侧的html。你能添加你的索引html吗？你有错误吗？检查时实际加载了什么？我在firebug中看到页面加载了。补充到问题中。但是内容没有显示在页面上。我不是在manageservices.html上创建左视图和右视图吗？据我所知，您只有两个子视图，左视图和右视图没有内容？你能提供一个打劫器吗？顺便说一句，您确实初始化了ManagedServicesCtrl
两次。一次在配置中，一次在html中。嗨，我用代码更新了我的实际拥有情况，并添加了左侧和右侧的html。你能添加你的索引html吗？你有错误吗？检查时实际加载了什么？我在firebug中看到页面加载了。补充到问题中。但是内容没有显示在页面上。我不是在manageservices.html上创建左视图和右视图吗？据我所知，您只有两个子视图，左视图和右视图没有内容？你能提供一个打劫器吗？顺便说一句，您确实初始化了ManagedServicesCtrl
两次。一次在配置中，一次在html中。嗨，我用代码更新了我的实际拥有情况，并添加了左侧和右侧的html。你能添加你的索引html吗？你有错误吗？检查时实际加载了什么？我在firebug中看到页面加载了。补充到问题中。但是内容没有显示在页面上。我不是在manageservices.html上创建左视图和右视图吗？据我所知，您只有两个子视图，左视图和右视图没有内容？你能提供一个打劫器吗？顺便说一句，您确实初始化了ManagedServicesCtrl
两次。一次在配置中，一次在html中。嗨，我用代码更新了我的实际拥有情况，并添加了左侧和右侧的html。你能添加你的索引html吗？你有错误吗？检查时实际加载了什么？我在firebug中看到页面加载了。补充到问题中。但是页面上没有显示内容。我不是在manageservices.html上创建左和右子项吗？非常感谢。我这样做得到这个错误。错误：无法转换到抽象状态“manageservices”有问题。如何导航？链接还是javascript？可能您必须引用子状态。试试$state.go（'manageservices.main'）或状态1
嗨，我这样做了，它起作用了。href=“/#/manageservices”。我不明白为什么。但我添加了ui sref=“manageservices.main”，效果很好。非常感谢你的帮助！学到了很多，非常感谢。我这样做得到这个错误。错误：无法转换到抽象状态“manageservices”有问题。如何导航？链接还是javascript？可能您必须引用子状态。试试$state.go（'manageservices.main'）或状态1嗨，我这样做了，它起作用了。href=“/#/manageservices”。我不明白为什么，但我知道
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

$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 

    })