主要是使用angular的指令系統來自己封裝一個指令。其寫法有多種，這里只是很簡單的一種寫法。

HTML片段代碼1：

 <div class="text-center bigtop">                <go-you-want>                    <img ng-src="{{downimg}}"/>                </go-you-want>   </div>

HTML片段代碼2：

 <div class="goTop clearfix" style="position: fixed;right: 10px;bottom: 200px;">            <back-to-top class="label " title="返回頂部"><img src="img/gotop_03.png"/></back-to-top> </div>

js指令：

myApp.directive("goYouWant", function() {    return {        restrict : "E",        link : function(scope, element, attr) {            var e = $(element);            var firstDivHeight = $('.firstH').outerHeight();  //這里需要自己定義需要到達的地方            e.click(function() {                $('body, html').animate({                    "scrollTop" : firstDivHeight                }, 500)            })        }    }});

//回到頂部//var flag = false;myApp.directive("backToTop", function () {    return {        restrict: "E",        link: function (scope, element, attr) {            var e = $(element);            if($(document).scrollTop() == 0) {                e.fadeOut(200);            }            $(window).scroll(function () {                 //滾動時觸發                console.log($(document).scrollTop())                if ($(document).scrollTop() > 800) {                    //flag = true;                    e.fadeIn(300);                }    //獲取滾動條到頂部的垂直高度,到相對頂部800px高度顯示                else {                    //flag = false;                    e.fadeOut(200);                }            });            /*點擊回到頂部*/            e.click(function () {                $('html, body').animate({                 //添加animate動畫效果                    scrollTop: 0                }, 1000);            });        }    };});