Question

在我的前端，我有一个简单的index.html，我在其中放置了ng-view标签，如下所示：

<body>
    <div data-ng-controller="MainController">
        <ng-view> <ng-view/>
    </div>

我的routes.js文件是这样的：

(function() {
angular.module('mainApp')              
    .config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
        $routeProvider.when("/", {
            templateUrl: "/startbootstrap-landing-page/home.html"
        });
        $routeProvider.when("/products", {
            templateUrl: "/views/products.html"
        });
        $routeProvider.otherwise({ redirectTo: '/' });
    }]);

}）（）;

当我输入＆＃34; mywebsite.com/index.html#/"根据routes.js中的路由，它将加载＆＃34; /startbootstrap-landing-page/home.html"在div标签中放置ng-view。所以一切都很完美，直到这里。但问题是我在home.html中使用了本地寻址/链接标签，一旦我在ng-view div标签内加载home.html局部视图，它们就会停止工作。例如，我在home.html局部视图中使用了类似的东西：

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
  <ul class="nav navbar-nav navbar-right">
         <li>
             <a href="#about">About</a>
         </li>
         <li>
             <a href="#services">Services</a>
         </li>
         <li>
             <a href="#contact">Contact</a>
         </li>
  </ul>

所以当我点击例如＆＃34;联系＆＃34;它必须跳到我设计的页面的底部，我使用了这样的标签：

<a name="contact"></a>

。。。

但事实并非如此。

当用作带有html和body标签的独立html文件时，home.html页面与其本地#sdress / linking完美配合，但当用作在ng-view标签内加载的局部视图时，其本地链接功能将不再起作用。关于为什么会这样的想法？谢谢。

Answer 1

我认为angular正在控制基于＃的网址...你试过$anchorScroll吗？

How to handle anchor hash linking in AngularJS

此致

与ng-view

但事实并非如此。

1 个答案: