angularjs
文章平均质量分 78
Mars-xq
好记性不如烂笔头。
展开
-
JavaScript : 正则表达式
testconsole.log(/xq/.test('XQ Xq xQ xq 1 XQ Xq xQ xq'));//trueconsole.log(/xq/i.test('XQ Xq xQ xq 2 XQ Xq xQ xq'));//trueconsole.log(/xq/g.test('XQ Xq xQ xq 3 XQ Xq xQ xq'));//trueconsole.log(/xq/ig.test('XQ Xq xQ xq 4 XQ Xq xQ xq'));//truesearch原创 2021-01-07 18:01:35 · 32 阅读 · 0 评论 -
AngularJS-$sce的使用
为什么要用sce? 因为AngularJS里好些地方,比如路径默认是个字符串,不会认为是路径,从而访问不到我们需要的东西,那么我们就可以通过sce告诉angualrJS这个路径,这样是安全的。它有以下几种:所谓sce即“Strict Contextual Escaping”的缩写。翻译成中文就是“严格的上下文模式”也可以理解为安全绑定。$sce.trustAs(type,name);$sce.t原创 2017-03-12 23:32:11 · 2511 阅读 · 0 评论 -
AngularJs-单击按钮事件中的冒泡现象
$event.stopPropagation()阻止事件运行,防止冒泡传递事件用法:ng-click="doSomeSth();$event.stopPropagation();示例一:Stop Propagation的情况下点击button你将会看见两条log记录:button和它的容器,否则只会出现button的log信息。<!DOCTYPE html><html lang="en" ng-a原创 2017-03-12 23:25:02 · 1607 阅读 · 0 评论 -
angularjs的controller间数据传递
继承关系:1、一般的数据传递父影响子,子不影响父域1、如果子不确定数据,父决定他的数据。先点击父级,再点击子级 2、如果子确定了数据,父不再决定他的数据。先点击子级,再点击父级,子不再改变 <!DOCTYPE html><html ng-app="myApp"><head> <meta charset="utf-8"> <title>My AngularJS App</titl原创 2017-04-08 18:04:32 · 2711 阅读 · 0 评论 -
angularjs页面的跳转与传参
方法一:location.href第一个界面:布局 <li ng-repeat="remindItemData in remindListData" ng-click="goto(remindItemData)"> //do somgthing</li>第一个界面:js跳转方法$scope.goto=function (msg) { var hre = 'remind_info.html原创 2017-03-23 11:35:47 · 15848 阅读 · 1 评论 -
利用angular指令监听ng-repeat渲染完成后执行脚本
业务中有时需要在异步获取数据并用ng-repeat遍历渲染完页面后执行某个操作,angular本身并没有提供监听ng-repeat渲染完成的指令,所以需要自己动手写。有经验的同学都应该知道,在ng-repeat模板实例内部会暴露出一些特殊属性index/index/first/middle/middle/last/odd/odd/even,index会随着每次遍历(从0开始)递增,当遍历到最后一个时原创 2017-04-10 18:20:54 · 1681 阅读 · 0 评论 -
angularjs-ng-repeat
1、angularjs程序中获取点击item的position:<!DOCTYPE html><html><head><meta charset="utf-8"><script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body ng-app="myA原创 2017-03-17 11:25:37 · 448 阅读 · 0 评论 -
js闭包与java反射的概念
闭包函数外部访问函数内部变量。 本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。 能够读取其他函数内部变量的函数。 使用闭包的注意点 1)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。 2)闭包会在父函数外部,改变父函数内部变量的值。所以,如原创 2017-04-17 18:09:18 · 1363 阅读 · 0 评论 -
AngularJs $cacheFactory 缓存服务
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="../angular.min.js"></script></head><!--AngularJs $cacheFactory 缓存服务$cacheFactory.Cache 可以原创 2017-04-17 18:10:17 · 702 阅读 · 0 评论 -
angular-$cookieStore
使用方法1、先引入angular-cookies.js:注意:angular-cookies.js要和angular.js的版本要一致,否则会报错: TypeError: $browser.addPollFn is not a function<script type="text/javascript" src="../angular.js"></script><script type="tex原创 2017-04-18 16:06:40 · 5216 阅读 · 0 评论 -
sessionStorage 、localStorage 和 cookie
angularjs中使用sessionStorage app.factory('locals', ['$window', function ($window) { return { //存储单个属性 set: function (key, value) { $window.sessionStorage[key] =原创 2017-04-18 16:13:17 · 2156 阅读 · 1 评论 -
html中选取图片并预览
注意点:1、使用FileReader对象的readAsDataURL方法来读取图像文件:fileReader.readAsDataURL的执行顺序:在fileReader.onload前执行。2、保存图片的base64字符串,使用sessionStorage做缓存。3、动态创建节点并添加ng-click='deletePhoto($event)' 时,需要在append前添加 var $li = $原创 2017-04-18 19:17:03 · 7038 阅读 · 1 评论 -
angular-页面跳转传递参数
页面1:传递参数<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="../angular.js"></script></head><body ng-app="myAppGoTo1" ng-controller="myCtrlGoTo原创 2017-04-19 16:27:58 · 6712 阅读 · 1 评论 -
使用FileReader对象的readAsDataURL方法来读取图像文件
readAsDataURL方法会使用base-64进行编码,编码的资料由data字串开始,后面跟随的是MIME type,然后再加上base64字串,逗号之后就是编码过的图像文件的内容。data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHQAAAB0CAYAAABUmhYnAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAA......使用原创 2017-04-19 16:29:42 · 50599 阅读 · 3 评论 -
angular-请求数据
问题一:angularjs $http 中的data传递参数后端没法接收 但是用params传递参数参数在url后后端能接收 ?GET请求的时候用params, POST/PUT/PATCH/DELETE请求时用data.根据官方文档:params – {Object.<string|Object>} – Map of strings or objects which will be ser原创 2017-04-20 16:32:31 · 1047 阅读 · 0 评论 -
Angular 动态生成html中 ng-click无效
//创建节点var html = "<a href='javascript:void(0);' ng-click='test()'></a>" //用$compile进行编译var $html = $compile(html)($scope); //添加到页面中,这样ng-click就可以触发function了 $("body").append($html); 项目中用到: var l原创 2017-04-17 15:26:22 · 5071 阅读 · 0 评论 -
angularjs 本地数据存储LocalStorage
1、定义服务 //=========本地存储数据服务============ app.factory('locals', ['$window', function ($window) { return { //存储单个属性 set: function (key, value) { $window.local原创 2017-04-17 16:16:46 · 11417 阅读 · 2 评论 -
js-用于上传的FormData与Blob
BLOBBLOB (binary large object),二进制大对象,是一个可以存储二进制文件的容器。在计算机中,BLOB常常是数据库中用来存储二进制文件的字段类型。BLOB是一个大文件,典型的BLOB是一张图片或一个声音文件,由于它们的尺寸,必须使用特殊的方式来处理(例如:上传、下载或者存放到一个数据库)。构造方法script> var blob = new原创 2017-04-19 17:52:36 · 36085 阅读 · 6 评论 -
angularjs-base64编码和解码
<!DOCTYPE HTML><html><head> <meta charset="utf-8"> <title>base64加密</title> <script> function Base64(){ // private property _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZa原创 2017-03-07 22:19:54 · 8332 阅读 · 0 评论 -
angularjs-迭代出第一项和其他项
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body ng-app="myApp" ng-controller="myCtrl"><div原创 2017-03-07 22:15:58 · 618 阅读 · 0 评论 -
angularjs-标签页tab选项卡
选项卡一:JavaScript+html+css<!DOCTYPE html><html> <head> <meta charset="utf-8"> <style> #div1 .active{ background:blue; } #div1 div{原创 2017-03-07 21:40:23 · 8886 阅读 · 0 评论 -
angularjs-http服务
angular提供了http服务来同服务端进行通信,http服务对浏览器的XMLHttpRequest对象进行了封装,让我们可以以ajax的方式来从服务器请求数据。$http服务是一个接受一个参数的函数,参数的类型是对象,用来配置生成的http的请求,该函数返回一个promise对象。var promise = $http({ method:'GET', url:'/api/user.jso原创 2017-02-28 17:51:20 · 691 阅读 · 0 评论 -
angularjs服务
出于内存占用和性能的考虑,控制器只会在需要时被实例化,并且不再需要就会被销毁。这意味着每次切换路由或重新加载视图时,当前的控制器会被AngularJS清除掉。服务提供了一种能在应用的整个生命周期内保持数据的方法,它能够在控制器之间进行通信,并且能保证数据的一致性。当重载或者刷新界面时,数据不会被清除,而且还与加载之前保持一致。主要功能:为实现应用的功能提供数据和对象。对外提供某个特定的功能,如消息服原创 2017-02-22 15:24:27 · 604 阅读 · 0 评论 -
angularjs中的MVC:路由、控制器继承
参考:《angularjs实战》model显式与隐式model的定义<body><div ng-controller="c5_1"> <!--显式--> <div class="show">{{name}}</div> <!--隐式:ng-model--> <input ng-model="score" value="95"/> <div class="sho原创 2017-02-21 17:31:37 · 1751 阅读 · 0 评论 -
angularjs指令:replace与transclude的区别
将视图模板(Template或TemplateUrl)替换到指定位置的视图(Restrict), replace:自定义指令名称是否保留。 true:不保留指令名 false:保留指令名(默认) Transclude:是否将原来视图的内容嵌入到视图模板(Template或TemplateUrl)中。 true:保留替换前的节点内容。 false:直接覆盖原有内容。 ng-tranclu原创 2017-02-23 15:13:29 · 1904 阅读 · 0 评论 -
Angular中的$apply()以及$digest()
双向数据绑定(Two-way Data Binding),这个特性大大简化了我们的代码编写方式。数据绑定意味着当View中有任何数据发生了变化,那么这个变化也会自动地反馈到scope的数据上,也即意味着scope模型会自动地更新。类似地,当scope模型发生变化时,view中的数据也会更新到最新的值。当你写下表达式如{{ aModel }}时,AngularJS在幕后会为你在scope模型上设置一个原创 2017-02-23 17:11:01 · 508 阅读 · 0 评论 -
angular.element方法汇总
本文主要给大家汇总了一下angular.element的方法,十分的详细,这里推荐给大家参考下。addClass()-为每个匹配的元素添加指定的样式类名after()-在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点append()-在每个匹配元素里面的末尾处插入参数内容attr() - 获取匹配的元素集合中的第一个元素的属性的值bind() - 为一个元素绑定一个事件处理原创 2017-02-23 17:12:15 · 982 阅读 · 0 评论 -
angularjs指令compile、link
link的值是一个函数,用来定义指令的行为。从传入的参数中可以获取到当前元素。编译三阶段: 1. 标准浏览器API转化 将html转化成dom,所以自定义的html标签必须符合html的格式 2. Angular compile 搜索匹配directive,按照priority排序,并执行directive上的compile方法 3. Angular link 执行directive上的原创 2017-02-23 17:58:52 · 868 阅读 · 0 评论 -
Angular的 $q, defer, promise,$http
$q$q是Angular的一种内置服务,它可以使你异步地执行函数,并且当函数执行完成时它允许你使用函数的返回值(或异常)。$q的其他方法$q.when(value)//传递变量值,promise.then()执行成功回调//接收第一个参数为一个任意值或者是一个promise对象,//其他3个同promise的then方法,返回值为一个promise对象。//第一个参数若不是promise对象原创 2017-02-24 00:31:45 · 1861 阅读 · 0 评论 -
angularjs中的指令
指令的参数如下:angular.module('app', []).directive('myDirective', function() { return { restrict: String, //规定指令在HTML代码中可以使用什么表现形式。 //A代表属性、E代表元素、C代表类、M代表注释。默认用AE这两种方式。 priority: Num原创 2017-02-23 14:33:20 · 714 阅读 · 0 评论 -
angularjs 表达式与ng-bind
AngularJS 表达式写在双大括号内:{{ expression }}。 AngularJS 将在表达式书写的位置”输出”数据。 AngularJS 表达式 很像 JavaScript 表达式:它们可以包含文字、运算符和变量。 实例 {{ 5 + 5 }} 或 {{ firstName + ” ” + lastName }}ng-bind 指令把应用程序数据绑定到 HTML 视图。ng-b原创 2017-02-24 10:59:04 · 1916 阅读 · 0 评论 -
angularjs-日期格式化
参考:AngularJS入门教程:日期格式化<!DOCTYPE html><html ng-app="myApp"><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.原创 2017-03-08 09:50:37 · 674 阅读 · 0 评论 -
angularjs-自定义过滤器示例
示例一:<!doctype html><html ng-app="myApp"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"><原创 2017-03-08 12:07:52 · 11966 阅读 · 0 评论 -
angularjs-过滤器
Filter是用来格式化数据用的。Filter的基本原型( ‘|’ 类似于Linux中的管道模式):{{ expression | filter }}Filter可以被链式使用(即连续使用多个filter):{{ expression | filter1 | filter2 | ... }}Filter也可以指定多个参数:{{ expression | filter:argument1:argume原创 2017-02-27 09:49:48 · 511 阅读 · 0 评论 -
angularjs-路由
AngularJS 路由机制是由ngRoute模块提供,它允许我们将视图分解成布局和模板视图,根据url变化动态的将模板视图加载到布局中,从而实现单页面应用的页面跳转功能。实现无刷新的视图切换。首先需要在页面引入angular和angular-route,注意要在angular-route之前引入angular,这主要是因为angular-route.js需要传入window.angular这个参数原创 2017-02-27 11:38:54 · 433 阅读 · 0 评论 -
html5Mode
无刷新切换路由,即url变了,加载了相应的模板,但是框架模板页index.html却没有刷新。为了实现这个功能,angularjs针对新旧浏览器提供了两种方式, 针对老式浏览器可以使用标签模式, 针对现代浏览器可以使用HTML5模式。 前者在URL中使用#来防止页面刷新,同时形成浏览器历史记录。 具体形式如下http://yoursite.com/#!/inbox/allAngularJS支原创 2017-02-27 16:36:04 · 1072 阅读 · 0 评论 -
route相关方法
route−route -routeProvider服务 -依赖ngRoute模块route能够在路径发生改变的时候,渲染不同的视图,调用不同的控制器.它监测了location.url(),然后根据路径来匹配相应的路由。route通常和routeProvider服务和ngView指令一起使用方法:reload()在路由没有改变的时候,再次加载当前路径的路由,重新渲染ng-view,实例化一个原创 2017-02-27 17:06:44 · 586 阅读 · 0 评论 -
angularjs+ionic+cordova+Android studio的环境配置
node.js安装:官网 https://nodejs.org 检测(命令行):npm -vcordova下载(命令行):npm install -g cordova 检测(命令行):cordova -v 介绍:Cordova是一种Hybrid开发,可以被部署到android,ios等多个手机平台。Cordova就是一个中间件,让我们把WebAPP打包成HybridAPP,并且它提供了非常多原创 2017-02-17 10:54:13 · 10176 阅读 · 1 评论