angularJS系列:基础篇
[ 2017/05/11, 3789阅, 1评 ]
1.日期格式化 13位时间戳(毫秒为单位的直接格式化) {{1423130269432 | date:'yyyy-MM-dd HH:mm:ss'}} 10位时间戳(秒为单位的需要×1000转为毫秒再格式化) {{1438668006*1000 | date:'yyyy-MM-dd HH:mm:ss'}} 2.截取字符串 在HTML的模板绑定中:{{ limitTo_expression | limitTo : limit : begin}} In JavaScript:$filter('limitTo')(input, limit, begin) 栗子: ...
1.html中直接写(不建议) <script type="text/javascript"> angular.element(window).bind('load', function() { alert('1'); }); alert('2'); </script> 2.在controller里面利用$on或者$watch (function(){"use strict"; angular.module('myApp') .controller('testSth', ['$scope', f...
angular.element()将DOM元素或者HTML字符串封装为一个jQuery元素。 格式:angular.element(element);(括号中的element为包装成jquery对象的html字符串或者dom元素) $document和angular.element(document)是一样的,是一个整体的dom结构树,包含jqlite的所有方法,另外$document[0]和原生JS的document等效(使用时不要忘记注入$document哦) 如果jQuery可用,angular.element就相当于jQuery的$。如果不可用,angular.eleme...
AngularJS按照发布/订阅模式设计了其事件系统,使用时需要“发布”事件,并在适当的位置“订阅”或“退订”事件,就像邮箱里面大量的订阅邮件一样,当我们不需要时就可以将其退订了。具体到开发中,对应的就是$scope和$rootScope的$emit、$broadcast和$on方法。 0、发布 $broadcast和$emit用于发布事件,他们将事件名称和事件内容发布出去,就像是高考榜单一样,事件名称相当于考生的名字,而事件内容相当于考生的成绩等信息: $scope.$broadcast(eventName,args) $scope.$emit(eventNa...
angularJS去掉路由url里的#号
[ 2017/11/28, 4001阅, 1评 ]
AngularJS框架定义了自己的前端路由控制器,通过不同URL实现单面(ng-app)对视图(ng-view)的部署刷新,并支持HTML5的历史记录功能。默认状态下,是不启动HTML5模式的,此时URL中会包含一个#号,用来区别是AngularJS管理的路径还是WebServer管理的路径。 某些情况下,#号并不不太友好。比如美观度,还有有的地方不支持这种带#号的URL。下面记录下去掉#号的方法: 1.入口文件index.html中增加<base>标签 <!DOCTYPE html> <html> <head> <...
angularJS之$location服务
[ 2017/11/20, 3529阅, 0评 ]
The $location service parses the URL in the browser address bar (based on the window.location) and makes the URL available to your application. Changes to the URL in the address bar are reflected into $location service and changes to $location are reflected into the browser address bar. The $locati...
angularJS基于TouchSlide的触屏轮播实现
[ 2017/11/11, 4125阅, 0评 ]
大话主席的TouchSlide插件短小精悍,各种效果也比较实用,非常适合用于移动端的项目。但是在基于angularjs的项目中,轮播的数据是从服务端获取的,需要从服务端拿到数据之后才能执行TouchSlide的方法,而且TouchSlide对于ng-repeat出来的数据极不友好,所以我偏不使用ng-repeat而直接append添加到DOM中,虽说有悖于angularjs的一些初衷,但是问题确实快速的解决了,哈哈,特此贴下代码记录一番,后期再逐渐优化更新。 效果预览:angularjs基于TouchSlide的触屏轮播 TouchSlide各种效果配置信息及下载详见...
angularJS分页功能的简单实现
[ 2017/08/25, 4269阅, 0评 ]
思路:触发页码切换时发送对应请求到服务器,成功后替换原来的数据。适合PC端使用。 无限滚动加载:angularJS插件:ngInfiniteScroll无限滚动加载数据(自动分页) 1、controller myApp.controller("pageNaviCtrl",['$scope','$http','pageNavi',function($scope,$http,pageNavi){ $scope.pageCur = 1; $scope.pageAll = 0; $scope.pages = []; $scope.showPageNavi = fa...
angularJS封装md5等加密模块
[ 2017/08/02, 6127阅, 0评 ]
1.引入文件encrypt.js 2.注入模块 var myApp = angular.module('myApp',['Encrypt']); 3.引用 myApp.controller('myController', function($scope,Md5,Base64,Sha1){ // MD5加密当前日期 $scope.md5Value = Md5.hex_md5(new Date()); }) encrypt.js 文件内容如下: /** * * @authors lsmife (you@example.org...