$anchorScroll

根据HTML5的规则，当调用这个函数时，它检查当前的url的hash值并且滚动到相应的元素。

监听$location.hash()并且滚动到url指定的锚点的地方。可以通过$anchorScrollProvider.disableAutoScrolling()禁用。

依赖：$window   $location   $rootScope

使用：$anchorScroll();

使用代码：

  #id {

      height:500px;

  }

  #bottom {

      margin-top:1500px;

  }
  <div ng-app="Demo">

      <div ng-controller="testCtrl as ctrl">

        <div id="top" ng-click="ctrl.gotoBottom()">跳到底部</div>

        <div id="bottom" ng-click="ctrl.gotoTop()">跳到顶部</div>

      </div>

  </div>
  (function () {

    angular.module("Demo", [])

    .controller("testCtrl",["$location", "$anchorScroll",testCtrl]);

    function testCtrl($location,$anchorScroll){

      var vm = this;

      vm.gotoTop = function () {

        $location.hash("top");

        $anchorScroll();

      };

      vm.gotoBottom = function () {

        $location.hash("bottom");

        $anchorScroll();

      };

    };

  }());

$controller

$controller负责实例化控制器。

这只是个简单的$injector调用，但为了以前版本的这个服务能被覆盖而被提取进一个服务。

依赖：$injector

使用：$controller(constructor,locals);

constructor：如果调用了一个函数，那么这个函数被认为是控制器构造函数。否则，它被认为是一个使用以下步骤检索控制器的构造函数的字符串：

1.检查控制器是否在$controllerProvider注册并命名。

2. 检查当前作用域上的字符串是否返回一个构造函数

3.在全局window对象上检查构造器。

locals：在本地注册controller。

使用代码：

  (function () {

    angular.module("Demo", [])

    .controller("demoCtrl",["$scope",demoCtrl])

    .controller("testCtrl",["$controller","$scope",testCtrl]);

    function demoCtrl($scope){

        var vm = this;

        $scope.print = function () {

            console.log("print");

        };

        vm.prt = function () {

            $scope.print();

        };

    };

    function testCtrl($controller,$scope){

        var ctrl = $controller("demoCtrl",{$scope:$scope});

        ctrl.prt(); // print

    };

  }());

$document

一个jQuery或jqlite包装了的浏览器window.document对象。

依赖：$window

使用代码：

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <script src='angular.js'></script>

    <title>title-$document</title>

</head>

<body>

  <div ng-app="Demo" ng-controller="testCtrl as ctrl"></div>

  <script>

  (function () {

    angular.module("Demo", [])

    .controller("testCtrl",["$document",testCtrl]);

    function testCtrl($document){

        var $title = $document[0].title;//title-$document

        var title = angular.element(window.document)[0].title;//title-$document

        var v = $document[0] === window.document;//true

    };

  }());

  </script>

</body>

</html>

Angular - - $anchorScroll、$controller、$document的更多相关文章

  1. AngularJs $anchorScroll、$controller、$document

    $anchorScroll 根据HTML5的规则,当调用这个函数时,它检查当前的url的hash值并且滚动到相应的元素. 监听$location.hash()并且滚动到url指定的锚点的地方.可以通过 ...

  2. angular 滚动

    AngularJs $anchorScroll.$controller.$document $anchorScroll 根据HTML5的规则,当调用这个函数时,它检查当前的url的hash值并且滚动到 ...

  3. AngularJS 源码分析1

    AngularJS简介 angularjs 是google出品的一款MVVM前端框架,包含一个精简的类jquery库,创新的开发了以指令的方式来组件化前端开发,可以去它的官网看看,请戳这里 再贴上一个 ...

  4. angular源码分析：angular的整个加载流程

    在前面,我们讲了angular的目录结构.JQLite以及依赖注入的实现,在这一期中我们将重点分析angular的整个框架的加载流程. 一.从源代码的编译顺序开始 下面是我们在目录结构哪一期理出的an ...

  5. angular源码分析：angular的源代码目录结构说明

    一.读源码,是选择"编译合并后"的呢还是"编译前的"呢? 有朋友说,读angular源码,直接看编译后的,多好,不用管模块间的关系,从上往下读就好了.但是在我看 ...

  6. Angular源代码学习笔记-原创

    时间:2014年12月15日 14:15:10 /** * @license AngularJS v1.3.0-beta.15 * (c) 2010-2014 Google, Inc. http:// ...

  7. 在angular中利用分页插件进行分页

    必需:angular分页js和css  当然还有angular.js   还需要bootstrap的css angular.min.js (下面我直接把插件粘贴上去了,以免有的同学还要去找.是不是很贴 ...

  8. Angularjs 源码

    /** * @license AngularJS v1.3.0-beta.15 * (c) 2010-2014 Google, Inc. http://angularjs.org function t ...

  9. angular核心原理解析2：注入器的创建和使用

    上一课没有讲到创建注入器的方法createInjector. 此方法,会创建两种不同的注入器:第一种叫做providerInjector,第二种叫做instanceInjector.providerI ...

随机推荐

  1. Android ---paint类

    引自:http://www.cnblogs.com/-OYK/archive/2011/10/25/2223624.html Android Paint和Color类   要绘图,首先得调整画笔,待画 ...

  2. openwrt系统之字符设备驱动软件包加载、测试程序加载

    .首先将软件包(如mydrv)放到ubuntu虚拟机openwrt/trunk/package/kernel/目录下 .回到openwrt/trunk/目录下,make menuconfig进行配置, ...

  3. HDU 3715 Go Deeper

    二分答案 + 2-SAT判断 #include<cstdio> #include<cstring> #include<cmath> #include<vect ...

  4. 《accelerated c++》第九章---设计类

    本章简单介绍了类的设计,但是包含了一些好的设计原则. 1一些通用的设计原则 (1)一个函数是否设计成成员函数的原则:如果这个函数改变对象的状态,那么这个函数就应该成为这个对象的成员. (2)对于内置类 ...

  5. jsp c:forEach用法

    <c:foreach>类似于for和foreach循环   以下是我目前见过的用法:1.循环遍历,输出所有的元素.<c:foreach items="${list}&quo ...

  6. Tiles布局

    1. header, sidebar,welcome,footer 4个jsp文件 WEB-INF目录下创建模板文件: commons文件夹下 footer.jsp header.jsp layout ...

  7. 二叉堆（C#）

    参考:http://www.cnblogs.com/skywang12345/p/3610390.html using System; using System.Collections.Generic ...

  8. Ibatis自动生成dao sqlmapper文件和domain文件过程

    generator自动生成mybatis的xml配置.model.map等信息: 1.下载mybatis-generator-core-1.3.2.jar包.        网址:http://cod ...

  9. (中等) HDU 5293 Tree chain problem，树链剖分+树形DP。

    Problem Description   Coco has a tree, whose vertices are conveniently labeled by 1,2,…,n.There are ...

  10. [iOS Animation]-CALayer 缓冲

    缓冲 生活和艺术一样,最美的永远是曲线. -- 爱德华布尔沃 - 利顿 在第九章“图层时间”中,我们讨论了动画时间和CAMediaTiming协议.现在我们来看一下另一个和时间相关的机制--所谓的缓冲 ...