Question

我正在尝试将URL路由跳转到角度spa设置中的正确页面/视图

我的索引页设置如下：

<html data-ng-app="app">
  <body>
    <div>
      <div data-ng-include="'/app/layout/shell.html'"></div>
    </div>
  </body>
</html>

如下的shell页面：

<div data-ng-controller="ShellCtrl as vm">
<header>
    <div data-ng-include="'/app/layout/topnav.html'"></div>
</header>
<section id="content" class="content">
    <div data-ng-view></div>
</section>
</div>

topnav.html包含一个导航栏，链接指向不同的页面，如：

 <ul class="nav navbar-nav"> 
            <li class=""><a href="#/about"><span class="glyphicon glyphicon-info-sign"></span> About</a></li>
        </ul>

现在，当我点击“关于”链接时，它会在内容部分加载我的关于页面，就像它应该创建URL一样

http://localhost/#/about"

我的routeprovider设置如下：

app.config(['$routeProvider', '$locationProvider',
  function ($routeProvider, $locationProvider) {
      //$locationProvider.html5Mode(true);

      $routeProvider.
       when('/', {
           templateUrl: 'app/partials/home.html',
           controller: "HomeCtrl"
       }).
        when('/about', {
            templateUrl: 'app/partials/about.html',
            controller: 'AboutCtrl'
        }).
        when('/contact', {
            templateUrl: 'app/partials/contact.html'
        }).
        otherwise({
            redirectTo: '/'
        });

  }]);

现在我可以切换到我的应用程序中的页面，但每当我只是将url放入一个新窗口以“标记”到about页面时，它不起作用，它不会加载about视图。事实上，当我加载

时

http://localhost/

一开始它没有加载我的家庭观点。

我是否错过了一个关键部分，因为没有获取URL路由以从URL正确加载我的视图？

Answer 1

请记住，如果您正在使用Angular Js，那么所有页面加载等都在index.html页面中。

如果您直接从网址加载页面，它将无法加载，因为它需要一些javascripts，如路由，配置等运行，这些都与您的索引html页面绑定。

您可以在“属性”窗口中将启动页面指定为＃。

希望这能回答你的问题

Answer 2

添加＆＃34; /＆＃34;在你的角度hrefs之前：

<ul class="nav navbar-nav"> 
        <li class=""><a href="/#/about"><span class="glyphicon glyphicon-info-sign"></span> About</a></li>
</ul>

ASP.NET MVC AngularJS SPA URL路由无法解析为正确的视图

2 个答案: