Question

当我输入网址时，例如localhost:8080/contact，我的stateProvider工作正常但该页面未自动滚动到ng-include代码部分。

在app.js中：

$stateProvider
        .state('about', {
            url: '/about',          
            onEnter: function() {
              if ($("#section-1").offset() != null) {
                 $('html, body').animate({
                    scrollTop: $("#section-1").offset().top
                 }, 1000);
              }
            }
        })
        .state('contact', {
            url: '/contact',         
            onEnter: function() {
              if ($("#section-2").offset() != null) {
                 $('html, body').animate({
                    scrollTop: $("#section-2").offset().top
                 }, 1000);
              }
            }
        })

然后在index.html中：

<div class="row" scroll-spy>
    <nav class="navbar navbar-default">
       <ul class="nav navbar-nav">
           <li spy="section-1"><a ui-sref="home">Home</a></li>
           <li spy="section-2"><a ui-sref="contact">Contact</a></li>
       </ul>
    </nav>
    .....
    <div class="row">
        <section id="section-1">
            <img src="/images/sg1.jpg" style="width:200; height:700"/>
        </section>
    </div>
    <div class="row">
        <ng-include src="'/partials/contact.html'"></ng-include>
    </div>
</div>

在contact.html中：

<section id="section-2">
    <div class="row">
        <img src="/images/sg2.jpg" style="width:200; height:700"/>
    </div>
</section>

当我输入网址'localhost:8080/about'时，自动滚动功能正常，但它不适用于'localhost:8080/contact'。问题似乎与ng-include有关，因为将contact.html中的代码复制到index.html时没有问题。我做了一些调试，当我使用$("#section-2").offset()时，我意识到ng-include在加载时为空。如果我点击'Home'，那么'Contact'滚动就可以了。

如何解决在页面加载时$("section-2").offset()被评估为null的问题？

Angularjs无法在页面加载

0 个答案: