如何在角度js中自动滚动到div

时间:2014-07-01 06:18:19

标签: angularjs

我希望我的错误消息div出现,当我点击提交按钮,我希望该屏幕应自动滚动到该div我的代码片段如下:

CSS: - .error_msg

{
    background: none repeat scroll 0 0 #F16200;
    border: 0 solid #FF1055;
    color: #EFEFEF;
    display: block;
    margin-top: 5px;
    text-align: center;
    width: 41%;
}

该div的HTML:

<div id="error" class="error_msg">成功为{{display}}

创建了速度链接

在提交时调用的控制器: -

tmeModuleApp.controller('speedLinksController',function($scope,APIServices,Paths,$rootScope) {
    $scope.setSpeedLink =function() {
        var setLink         = $('.active').attr('valset_link');
        var display         = $('.active').attr('valset_display');
        var display_name    = $('.active').attr('valset_link_name');
        if(setLink != '')
        {
            $location.hash('error');        
            $scope.display= display_name;           
        }
    }
}

1 个答案:

答案 0 :(得分:0)

查看背叛$anchorScroll服务。

您应该注入$anchorScroll并在$locaiton.hash致电后致电。

<强>更新

实施例

HTML

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

JS

function ScrollCtrl($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();
  };
}