Javascript ngSmoothScroll角度指令不工作
我使用下面的指令使项目中的内容平滑地滚动到所选元素 这是我的密码:Javascript ngSmoothScroll角度指令不工作,javascript,angularjs,angularjs-directive,Javascript,Angularjs,Angularjs Directive,我使用下面的指令使项目中的内容平滑地滚动到所选元素 这是我的密码: ... <!-- build:js(.) scripts/vendor.js --> <!-- bower:js --> <script src="bower_components/jquery/dist/jquery.js"></script> <script src="bower_components/angular/angular.js">
...
<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-aria/angular-aria.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.js"></script>
<script src="bower_components/angular-messages/angular-messages.js"></script>
<script src="bower_components/angular-resource/angular-resource.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="bower_components/angular-touch/angular-touch.js"></script>
<!-- endbower -->
<!-- endbuild -->
<script src="bower_components/ngSmoothScroll/dist/angular-smooth-scroll.min.js"></script>
<!-- build:js({.tmp,app}) scripts/scripts.js -->
<script src="scripts/app.js"></script>
<script src="scripts/controllers/initcontroller.js"></script>
<!-- endbuild -->
<script src="scripts/libs/materialize.min.js"></script>
<script src="scripts/libs/angular-materialize.js"></script>
</body>
...
“smoothScroll”
是项目的实际依赖项。按照本文开头给出的链接中的说明,这是我在视图中所做的:
<li><a href="#" scroll-to="service-info" container-id="service-info">Contáctame</a></li>
...
<section class="service-info" id="service-info">
<h1 class="sofia-font">Detalles de Servicio</h1>
...
...
德塔莱斯服务酒店
...
但是,在我的grunt-serve
任务中,没有平滑滚动,也没有控制台或jslint发出的警告/错误
知道我做错了什么吗?我对angular很陌生,我仍在努力找到自己的出路 我不确定,但可能是因为您在链接上使用的是容器id,而不是非锚定标记。我用它滚动到页脚中的一个元素。我的代码是:
//the anchor link in my nav
<a href="#" scroll-to="footer" duration="2500">Click Me</a>
...
//the element I want to scroll to
<div id="footer"></div>
...
这对我也不起作用,试试看。它有一个现场演示要先在浏览器中测试
它还有一个“spy”指令,因此您可以向视图中的元素添加类。我也在寻找同样的东西。您运气好吗?您的滚动到和容器id具有相同的元素id,因此没有滚动是有意义的。
//the anchor link in my nav
<a href="#" scroll-to="footer" duration="2500">Click Me</a>
...
//the element I want to scroll to
<div id="footer"></div>
...
<script src="/bower_components/angular/angular.js"></script>
<script src="/bower_components/angular-animate/angular-animate.js"></script>
<script src="/bower_components/angular-aria/angular-aria.js"></script>
<script src="/bower_components/angular-messages/angular-messages.js"></script>
<script src="/bower_components/angular-material/angular-material.js"></script>
<script src="/bower_components/angular-sanitize/angular-sanitize.js"></script>
<script src="/bower_components/ngSmoothScroll/lib/angular-smooth-scroll.js"></script>
<script src="/js/app.module.js"></script>
<script src="/js/app.controller.js"></script>
<script src="/js/app.service.js"></script>
angular
.module('glasser', [
'ngMaterial',
'ngSanitize',
'smoothScroll'
])