网页没有固定角度

我试图让页面根据他们点击的内容转到页面的div部分。我有适当的标记id'd每个部分的div。我已经完成了一个测试，可以加载页面并键入url.com/services#insertidhere，它会转到正确的位置。问题是，当我试图在不会去的地方执行它的时候。即使显示的URL是正确的，它也会正常进入页面。网页没有固定角度

HTML摘录索引

<div ng-repeat="x in blue.services"> 
    <div class="wrapIMG"> 
     <img src="{{x.icon}}" /> 
     <img class="clone" src="{{x.icon}}" /> 
    </div> 
    <h4>{{x.title}}</h4> 
    <hr/> 
    <p>{{x.text}}</p> 
    <a ui-sref="services({id: x.title})" class="button2">About This</a> 
</div>

myapp.js预览可用

app.config(function($stateProvider){ 
    $stateProvider 
     .state('index', { 
      url:"/", 
      templateUrl: 'main.html', 
      data: { 
       cssId: 'home' 
      } 
     }) 
     .state('services', { 
      url: "/services/#:id", 
      templateUrl: 'services.html', 
      data: { 
       cssId: 'services' 
      } 
     }) 
});

服务HTML摘录

<section class="no-padding" style="" id="[id equal to x.title]"> ...</section> 
<section class="no-padding" style="" id="[id equal to x.title]"> ...</section> 
<section class="no-padding" style="" id="[id equal to x.title]"> ...</section>

我相信这个问题必须与.state URL，但它在URL中正确显示，但它只是不会到达该位置。

来源

2016-11-08 Joey

Angular在页面路由的URL中使用#（所以许多其他SPA框架）。

要将链接锚定到页面上的特定ID，请使用$anchorScroll service。

例子：

<div id="scrollArea" ng-controller="ScrollController"> 
    <a ng-click="gotoBottom()">Go to bottom</a> 
    <a id="bottom"></a> You're at the bottom! 
</div> 

<script> 
    angular.module('anchorScrollExample', []) 
    .controller('ScrollController', ['$scope', '$location', '$anchorScroll', 
    function($scope, $location, $anchorScroll) { 
     $scope.gotoBottom = function() { 
     // set the location.hash to the id of 
     // the element you wish to scroll to. 
     $location.hash('bottom'); 

     // call $anchorScroll() 
     $anchorScroll(); 
     }; 
    }]); 
</script>

来源

2016-11-08 17:48:38 Icycool

先进的道歉，如果这听起来很愚蠢，因为我正在学习角度的过程，但我想如果假设调用发生在另一个html页面上，这个调用如何工作。所以基本上它需要加载一个新页面，然后根据点击的内容滚动到该部分。 – Joey

$scope.toPage = function(){$state.go('index');}

你试试这个？

来源

2016-11-16 10:42:34 Prashanth

网页没有固定角度

回答

相关问题