
angular
暮志未晚NAN
这个作者很懒,什么都没留下…
展开
-
angular指令的简单案例和解释directive
app.directive("myview",function(){ return { restrict:"AEMC", template:"这是更换的后的文字!", replace:true }}); template:是讲标签修改的内容replace为ture则将修改。transclude配置项是什么意思?如果使用的元素标签,标签内部还有内容,在templ原创 2016-11-15 21:58:33 · 1039 阅读 · 1 评论 -
03 ionic+angular开发webapp笔记
ionic路由这是一个超级简单的ui-route路由,因为ionic用的是ui-route,而不是angular的ng-router,第三个属于内联模块 first second third this is third html var app = angular.module("myapp",["原创 2016-12-09 00:32:07 · 875 阅读 · 0 评论 -
01 ionic+angular开发webapp笔记
首先就是搭建环境,环境搭建比较费劲,用了三天才成功第一步,安装java的jdk,然后配置系统环境,就那三条东西加入环境变量第二部,去下载android studio,里面包含android sdk,打开想整哪个版本下载哪个版本的sdk,下载完一看30多g,吓到我了。第三部,安装nodejs,简单了,直接略过。第四部,npm install -g cordova第五步,npm i原创 2016-11-27 03:35:41 · 1056 阅读 · 1 评论 -
ionic+angular 真机调试
真机调试生成文件是ionic run android实时更新的代码是ionic run android -l -c原创 2016-12-16 02:00:36 · 5770 阅读 · 0 评论 -
angular +ionic app跨域请求
如果不设置头部的话,post请求自动变成了options请求,真坑所以,post请求的时候,需要配置一下headervar req = { method: 'POST', url: url,//url 请求的地址 headers: { 'Content-Type': 'application/x-www-f原创 2017-01-07 15:28:44 · 3584 阅读 · 0 评论 -
angular 监控数据模型变化的事件方法$watch
$watch简单使用$watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你。$watch(watchExpression, listener, objectEquality);每个参数的说明如下:watchExpression:监听的对象,它可以是一个angular表达式如'name',或函数如func转载 2017-01-09 17:10:32 · 2572 阅读 · 0 评论 -
angular的$http的ajax的请求操作
angular通过封装$http方法,封装了,ajax请求也通过$http封装了$http.get()和$http.post()的方法,这里由于图省事,这两种方法不如直接使用通用的方法这里先写一个案例,首先先写一个对象 var req = { method: 'POST',//请求的方式 url: ip,//请求的地址原创 2017-01-10 09:56:39 · 9623 阅读 · 0 评论 -
angular+ionic 的app上拉加载更新数据实现
第一步,首先需要在标签里面加入标签里面的属性解释,ng-if 值 布尔型,如果为true,则可以触发上拉事件on-infinite 上拉时触发的事件distance 列表底部滚动到可触发上拉事件的距离,默认为1%第二步:在控制器内书写$scope.hasmore = true;定义可触发事件的对象然后书写loadMore事件//上拉事件 $sc原创 2017-01-16 13:38:48 · 2042 阅读 · 1 评论 -
ionic使用中碰到的一些问题
1、No Content-Security-Policy meta tag found. Please add one when using the cordova-plugin-whitelist plugin.解决办法index.html 中添加《meta http-equiv="Content-Security-Policy" content="default-src *; st转载 2017-01-11 16:27:42 · 4971 阅读 · 1 评论 -
angular 实时更新模板视图的方法$apply
有的时候在回调里面写了更新scope的里面的内容,视图上面竟然没有同时更新,这就用到了$applyScope的特性接下来,看看Scope有哪些特性呢?Scope提供$watch方法监视Model的变化。Scope提供$apply方法传播Model的变化。Scope可以继承,用来隔离不同的application components和属性访问权限。Scope为Expres原创 2017-01-19 16:22:11 · 3656 阅读 · 0 评论 -
angular 取消或终止$http的ajax请求
首先需要在 controller里面将 $q注入在scope的里面声明一个变量var canceler;最后在事件内最上方写上//取消之前的请求 if (canceler) canceler.resolve(); canceler = $q.defer();这样就是最简单的阻止ajax继续运行的方法了原创 2017-01-19 18:19:52 · 4807 阅读 · 0 评论 -
ionic 上拉菜单的样式坑
正常情况应该显示成这样但是,在android上面却成了这样,坑死人不偿命就变成了这个鬼样子。。。什么原因呢?于是查看样式,对比后发现,android平台应用这段代码时候,会多出一段样式:原来,就是这部分样式导致了不正常的菜单出现。不知道框架为什么做如此处理,但于我们而言这样明显是不行的,于是乎修改ionic.css,如下:把这段css转载 2017-01-19 19:02:41 · 1330 阅读 · 1 评论 -
angular的provider配合config使用案例
无标题文档 {{name}} var app = angular.module("myApp", []); app.config(function(myFirstProvider){ myFirstProvider.name="zhangsan"; }); app.provider("myFirst",fun原创 2016-12-04 22:07:51 · 7456 阅读 · 0 评论 -
angular 模块引入简单实例
Document {{name}} {{name}} {{name}} //注册本页的模块 var mymodel = angular.module("mymodel", ["mymodel2"]); mymodel.controller("mycontroller1", ["$scope", func原创 2016-12-02 01:34:52 · 3793 阅读 · 0 评论 -
angular对象简单介绍
//判断是否是个数组angular.isArray([])//trueangular.isArray("strings")//false//判断是否是个日期对象var a = angular.isDate(new Date());//true//判断一个值是否被定义angular.isDefined(undefined);//falseangular.isDefined([])//t原创 2016-12-02 00:40:42 · 4639 阅读 · 0 评论 -
angular的directive指令的link方法
//link函数主要用于操作dom元素,给dom元素绑定事件和监听.link:function(scope,element,attr,ctrl,linker){ //scope:指令所在的作用域 //element:指令元素的封装,可以调用angular封装的简装jq方法和属性 //attr:指令元素的属性的集合 //ctrl:用于调用其他指令的方法,指令之间的互相通信使用,需要配合re原创 2016-11-16 01:26:15 · 9992 阅读 · 1 评论 -
02 ionic+angular开发webapp笔记
Angular js 的特性:MVC模块化和依赖注入双向数据绑定指令和ui控件MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用一种业务逻辑、数据、界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑。MVC原创 2016-11-29 00:09:32 · 812 阅读 · 1 评论 -
angular的官方推荐项目结构
首先需要创建一个总的文件夹,比如mydamo的文件夹,里面放入所有项目需要的文件然后第一层有两个文件夹,和一个json文件app //文件夹,放主要编写的文件node_modules //nodejs模块安装目录package.json //nodejs的配置项文件主要的就是app的文件夹css //样式文件夹images //图片文件夹js //js文件夹framework原创 2016-11-13 13:52:27 · 1214 阅读 · 0 评论 -
angular的路由实现,ngRoute
你学习一个新的框架都会有一个理由,我学习angular的理由就是因为angular的路由功能,只能说,开发angular的大神太溜了~~~下面,开始介绍我对ngRoute的使用心得ngRoute不属于angular的核心库,需要将ngRoute模块额外的引入然后用ng-view指定范围路由将会更新此区域然后在主模块中引入ngRoute模块var myModule = ang原创 2016-11-13 16:31:00 · 1685 阅读 · 1 评论 -
angular的动画ngAnimate模块
ngAnimate模块和ngRoute一样,不属于核心模块,都是需要script引入,然后在模块内依赖注入那ngAnimate做了什么?ngAnimate 模型可以添加或移除 class 。ngAnimate 模型并不能使 HTML 元素产生动画,但是 ngAnimate 会监测事件,类似隐藏显示 HTML 元素 ,如果事件发生 ngAnimate 就会使用预定义的 class 来设置原创 2016-11-14 01:00:13 · 3245 阅读 · 1 评论 -
angular checkbox全选的双向绑定
My cars: Check all {{n}}{{item}}{{flag}}点击 "Check all" 选择所有的车。 angular.module('myapp', []) .controller("myCtrl", function ($scope) { $scope.checkItem = ["V原创 2016-09-18 08:38:06 · 1315 阅读 · 0 评论 -
angular路由功能uiRouter
前面我刚写了一篇文章,解释了angular的路由ngRoute模块,为什么还有uiRouter这个插件呢?1、UI-Router支持嵌套视图,ngRoute不支持2、UI-Router支持多视图,ngRoute不支持ngRoute 和 ui-route 相比:$route —> $state$routeParams —> $statePara原创 2016-11-14 22:06:05 · 4911 阅读 · 1 评论 -
angular的run方法
run 方法初始化全局的数据 , 只对全局作用域起作用 如 $rootScope,局部的$scope不管用var m1 = angular.module('myApp',[]);m1.run(['$rootScope',function($rootScope){$rootScope.name = 'hello';}]);原创 2016-12-01 00:03:38 · 7662 阅读 · 0 评论 -
angular $apply方法
$apply 方法 作用:Scope 提供$apply 方法传播 Model 的变化$apply 方法 使用情景 :AngularJS 外部的控制器(DOM 事件、外部的回调函数如 jQuery UI 空间等)调用了 AngularJS 函数之后,必须调用$apply。在这种情况下,你需要命令 AngularJS 刷新自已(模型、视图等),$apply 就是用来做这件事情的原创 2016-12-01 00:09:34 · 1179 阅读 · 0 评论 -
angular $watch方法监视模型变化
$watch方法就是监视变量的变化使用,下面放上一个教程代码 无标题文档 价格: 个数: 费用:{{ sum() | currency:'¥' }} 运费:{{iphone.fre | currency:'¥'}} 总额:{{ sum() + iphone.fre | currency:'¥'}}原创 2016-12-01 00:51:43 · 2009 阅读 · 0 评论 -
angular.element
如果界面引入了jq,angular.element 等同于 $,如果angular不存在,则使用angular内部封装好的jqLite.jqLite只提供了以下方法addClass() - 不支持一个函数作为第一个参数after()append()attr() - 不支持函数作为参数bind()(不推荐,使用) -不支持命名空间,选择或EVENTDATAon()children(原创 2016-12-01 23:07:40 · 1737 阅读 · 0 评论 -
04 ionic+angular开发webapp笔记(修改应用的图标和载入图片和app的名字)
修改应用的基础信息很简单,在应用的根目录找到config.xml文件 这里修改app名字 这里是app描述 这里填写作者和邮箱的地方 在上面的位置直接修改app的相关信息即可修改app的图标和载入图片需要找到resources文件夹,进入后会发现两个图片,一个叫icon.png这是app图标的原图片,推荐大小102原创 2017-02-11 16:56:37 · 1702 阅读 · 1 评论