Angular-UI-Router无法正常工作

问题描述：

因此，今天我添加了angular-ui-router到我的webapp。但是，它显示出一些非常奇怪的行为。它用于显示ui-view中的当前页面。所以在页面中的页面。Angular-UI-Router无法正常工作

现在，它的工作正确，但它不显示子页面，我似乎无法弄清楚为什么。

主页

<!doctype html> 

<html lang="en" ng-app="ExampleApp"> 

    <head> 

     <meta charset="UTF-8"> 
     <title>Example App</title> 

    </head> 

    <body> 

     <div>  

      <div ui-view></div> 

     </div> 

     <!-- Angular --> 
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.js"></script> 
     <!-- UI-Router --> 
     <script src="//angular-ui.github.io/ui-router/release/angular-ui-router.js"></script> 
     <!-- Main app file --> 
     <script src="/js/main.js"></script> 

    </body> 

</html>

main.js

var ExampleApp = angular.module('ExampleApp', ['ui.router']); 

ExampleApp.config(function($stateProvider, $urlRouterProvider) { 
    // 
    // For any unmatched url, redirect to /home 
    $urlRouterProvider.otherwise("/home"); 
    // 
    // Now set up the states 
    $stateProvider 
     .state('home', { 
      url: "/home", 
      templateUrl: "views/home.html", 
      controller: "MainController" 
     }) 
     .state('settings', { 
      url: "/settings", 
      templateUrl: "views/settings.html", 
      controller: "SettingsController" 
     }) 
     .state('settings.account', { 
      url: "/account", 
      templateUrl: "views/settings.account.html", 
      controller: "AccountSettingsController" 
     }); 
}); 

ExampleApp.config(["$locationProvider", function($locationProvider) { 
    $locationProvider.html5Mode(true); 
}]);

所以要确认的问题：'home'和'settings'状态正确显示，但'settings.account'不？ – 2014-09-10 21:33:02

那么，如果我点击“设置”，然后点击“帐户”，就会发生这种情况。但是，如果我通过chrome中的地址栏进入'/ settings/account'，我会得到一个空白页面。 – User183849481 2014-09-10 22:29:19

我也有这个问题。请求页面时尝试使用尾部斜线。 – 2014-12-17 23:56:45

答

试试这个

url:"settings/account",

Angular-UI-Router无法正常工作

相关推荐