Search code examples
angularjsanchor-scroll

Angular controller not working with anchorscroll


I'm trying to do a simple $anchorScroll but my controller is not working.

here's my module

(function () {

'use strict';

angular.module('app', [
    'ui.bootstrap',
    'app.article'
]);

})();

and here's my controller

(function () {
'use strict';

angular
    .module('app.article')
    .controller('Article', Article);

function Article($scope, $location, $anchorScroll) {

    var vm = this;
    vm.backToTop = backToTop;

    function backToTop() {
        $location.hash('top');
        $anchorScroll();
    }

}

})();

I'm adding the ng-app and the ng-controller correctly.

Any ideas?

here's the plunkr: https://plnkr.co/edit/Rnsahf24ds1pYWKz9Ete?p=preview


Solution

  • There are few things that you are missing in your code,

    (i) You are refering to angular2 script while your code is defined for angular 1.3, so change the reference as

       <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js"></script>
    

    (ii) You need to refer to bootstrap library and necessary css if you are injecting in angular application

     <script type="text/javascript" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.2.js"></script>
    

    Here is the working App