本文实例讲述了AngularJS使用带属性值的ng-app指令实现自定义模块自动加载的方法。分享给大家供大家参考，具体如下： 接着前面那篇《AngularJS使用ng-app自动加载bootstrap框架问题分析》，现在我们看下如何使用带属性值的ng-app命令，让ng-app自动加载我们自定义的模块作为根模块。 <!DOCTYPE html> <html><head><script src="angular.js"></script><script>var rootMoudle = angular.module(rootMoudle, []);rootMoudle.controll...
前言 AngularJS是google在维护，其在国外已经十分火热，可是国内的使用情况却有不小的差距，参考文献/网络文章也很匮乏。网上关于AngularJS中run方法的介绍也比较少，本文就主要总结了关于AngularJS中run方法的巧妙运用，感兴趣的朋友们可以一起来学习学习。 一、浏览器判断 在angular做微信应用的时候，有时候我们也想把相同一份代码运行在非微信的浏览器上，这时候我们可以在angular的run上写点东西实现~ 例如asw.run函数里执行定...
本文实例讲述了AngularJS控制器controller给模型数据赋初始值的方法。分享给大家供大家参考，具体如下： 之前的文章《AngularJS入门示例之Hello World详解》，很简单的就实现了模型数据和页面显示的自动绑定。现在我们使用控制器，给模型赋初始值。如果使用jQuery来实现变量赋初值，需要在页面加载完成后执行 $("#target").attr("value",selfValue);使用AngularJS代码如下： <!doctype html> <html lang="en" ng-app><head><meta c...
本文实例分析了AngularJS框架的ng-app指令与自动加载实现方法。分享给大家供大家参考，具体如下： ng-app是angular的一个指令，代表一个angular应用（也叫模块）。使用ng-app或ng-app=""来标记一个DOM结点，让框架会自动加载。也就是说，ng-app是可以带属性值的。如果想要实现自动加载，那么就不能让ng-app带有属性值。 <html><body ng-app><div>div1:{{1+3*2}}</div><script src="angular.js"></script></body> </html>1、不含ng-...
前言 在用AngularJS期间, 经常用到ng-repeat, 业务中有时需要在异步获取数据并用ng-repeat遍历渲染完页面后执行某个操作，angular本身并没有提供监听ng-repeat渲染完成的指令，所以需要自己动手写。有经验的同学都应该知道，在ng-repeat模板实例内部会暴露出一些特殊属性$index/$first/$middle/$last/$odd/$even，$index会随着每次遍历（从0开始）递增，当遍历到最后一个时，$last的值为true，so，通过判断$last的值来监听ng-repea...
angular为我们提供了很多的工具方法。 angular.bind 更改this指向 var obj1 = {name : obj1,show : function(str){return this.name + str;} }; var obj2 = {name : obj2 };var a = angular.bind(obj2,obj1.show, is a object); var b = angular.bind(obj2,obj1.show,[ is a object]); console.log(a());angular.bind会根据你的参数类型来决定调用call或apply，注意a和b後面传递的参数，a是传递一个字符串，b是传递一个数组。 ang...
ui-router 的工作原理非常类似于 Angular 的路由控制器，但它只关注状态。 在应用程序的整个用户界面和导航中，一个状态对应于一个页面位置通过定义controller、template和view等属性，来定义指定位置的用户界面和界面行为通过嵌套的方式来解决页面中的一些重复出现的部位最简单的形式模板可以通过下面这种最简单的方式来指定 <!-- in index.html --> <body ng-controller="MainCtrl"><section ui-view></section> </body> // in a...
本文实例讲述了AngularJS开发教程之控制器之间的通信方法。分享给大家供大家参考，具体如下： 一、指令与控制器之间通信，无非是以下几种方法： 基于scope继承的方式 基于event传播的方式 service的方式（单例模式） 二、基于scope继承的方式： 最简单的让控制器之间进行通信的方法是通过scope的继承。假设有两个控制器Parent、Child，Child 在 Parent 内，那Child 可以称为控制器Parent的子控制器，它将继承父控制器Parent的scope...
前言 在Angular框架中,创建团队为使用者进行了Ajax请求的封装,并通过$http服务暴露出相关的接口.Angular在其官方文档中指出, $http服务底层针对Web常见的安全攻击做出了相应的对策,也就是说使用$http服务封装的Ajax为使用者提供了更为安全的保障.作为一个框架,保证框架的可用性,适配性是很有必要的. Angular在设计,实现中也体现出来了这样的良好风格.我们通常在使用Ajax时,有时候希望我们能够在请求发起前或接收到请求后做一些相应...
本文实例讲述了AngularJS基于ui-route实现深层路由的方法。分享给大家供大家参考，具体如下： 1.前面我们通过了简单的ng-route实现了简单层次的路由，对于深层次的路由，我们可以通过ui-route来实现。 （1）ng-route的局限性：一个页面无法嵌套多个视图，也就是说一个页面只能有包含一个页面一个控制器的切换。 （2）ui-route的改进：在具有富客户端的单页应用中，要在一个页面中呈现不同的视图，我们可以通过ui-route实现路由的嵌...
本文实例讲述了AngularJS定时器的使用与移除操作方法。分享给大家供大家参考，具体如下： 1.相比较于JS中setTimeInterval和setTimeout，AngularJS中通过interval来实现定时器的效果，通过timeout来实现时间延迟。 $timeout //实现的是延迟执行 $interval //实现的是定时器的效果我们分别来看这两个服务 （1）timeout timeout相当于JS原生里面的延迟执行，不同的是该服务的函数返回的是一个promise对象。 var timer=$timeout(functi...
本文实例总结了AngularJS中$apply方法和$watch方法用法。分享给大家供大家参考，具体如下： 引言 最近在项目中封装控件的时候用到了$watch方法来监听module中的值的变化，当时小编对这个方法不是很了解，所以在网上找了一些资料来学习一下，下面小编就给大家简单介绍一些AngularJS中Scope 提供$apply 方法传播Model 的变化和$watch方法监听module变化。 $apply使用情景 AngularJS 外部的控制器（DOM 事件、外部的回调函数如 jQuery...
本文实例讲述了AngularJS封装指令方法。分享给大家供大家参考，具体如下： 引言：angularjs是一个中等重量级的前端开发框架 HTML是一门很好的为静态文本设计的语言，但要构建动态的web应用它就显的乏力了。通常，我们使用以下技术来解决静态网页技术在构建动态应用上的不足： 1.类库：类库是一类函数的集合，它能帮助你写web应用。这里起主导作用是你的代码，由你来决定何时使用类库。典型的类库，例如prototype、jQuery等。 2.框架...
本文实例讲述了AngularJS实现用户登录状态判断的方法。分享给大家供大家参考，具体如下： 使用AngularJS的单页面应用时，由于是本地路由在控制页面跳转，但是有的时候我们需要判断用户是否登录来判断用户是否能进入界面。 angularjs是mvc架构所以实现起来很容易也很灵活，我们只MainController里增加一个路由事件侦听并判断，这样就可以避免未登录用户直接输入路由地址来跳转到登录界面地址了 代码中的 $rootScope.user是登录后把用...
Swiper是目前较为流行的移动端触摸滑动插件，因为其简单好用易上手，受到很多前端开发者的欢迎。 今天在使用Swiper的时候遇到这个问题： 使用angularjs动态循环生成swiper-slide类，在swiper-wrapper里生成6个以上的滑动页，可是就是划不到第二页，尝试将longSwipesRatio的值修改到最小，仍然不起作用。 <div class="swiper-wrapper" > <!-- =======循环部分======= --> <div class="swiper-slide" ng-repeat="result in mediaList...