$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. oracle有三个默认的用户名和密码,但是都无法登录的解决方法

    system/change_on_install, system/manager是较旧版的预设密码, 在安装较新版时会提示你设定密码, 若没有或忘了设定, 请参考以下重设: sqlplus / as ...

  2. js数据显示在文本框中(页面加载显示和按钮触动显示)

    web代码如下: <!DOCTYPE html> <html> <head> <title>jsTest02.html</title> &l ...

  3. apache2.2.25+mod_jk-apache-2.2.2.so+apache-tomcat-7.0.56集群

    1.安装httpd-2.2.25-win32-x86-no_ssl.msi 按默认安装路径,我电脑如果自定义的话安装不了 2.下载mod_jk-apache-2.2.2.so 3.下载tomcat 我 ...

  4. PAT1009

    多项式乘法 和多项式加法类似,参考之前多项式加法的代码改改就出来了. 主要是注意一下.最大次数应该会有1000000,然后按照乘法规则来,分配率就没有问题 #include<cstdio> ...

  5. webapp之路--百度手机前端经验（转）

    看了之后收获很大,分享一下: 本文将围绕我半年来在移动前端工程化做的一些工作做的总结,主要从localstorage缓存和版本号管理,模块化,静态资源渲染方式三个方面总结手机百度前端一年内沉淀的解决方 ...

  6. stm32 RAM分配及占有(转)

    源:http://blog.chinaunix.net/uid-26921272-id-4550126.html 一个小的项目,在测试时间和产品量稍微大一些之后,出现了一些莫名其妙的非逻辑错误的Bug ...

  7. ios开发证书，描述文件，bundle ID的关系

    苹果为了控制应用的开发与发布流程,制定了一套非常复杂的机制.这里面的关键词有:个人开发者账号,企业开发者账号,bundle ID,开发证书,发布证书(又叫"生产证书"),开发描述文 ...

  8. [Big Data]Spark

    SPARK Spark是UC Berkeley AMP lab (加州大学伯克利分校的AMP实验室)所开源的类Hadoop MapReduce的通用并行框架,Spark,拥有Hadoop MapRed ...

  9. (中等) Hiho 1232 Couple Trees(15年北京网络赛F题)，主席树+树链剖分。

    "Couple Trees" are two trees, a husband tree and a wife tree. They are named because they ...

  10. CSS Font-family常用设置

    font-family: "Avenir Next", Avenir, "Helvetica Neue", Helvetica, "Lantinghe ...