
Angular
文章平均质量分 53
正在输入代码中
talk is cheap, show me the code
展开
-
angular(指令--restict匹配模式)
var app=angular.module("myapp",[]); app.directive('runn2',function(){ return{ restrict:"EACM", replace:true, template:"自定义指令" }; });resti原创 2016-04-13 23:40:40 · 903 阅读 · 0 评论 -
Angular-cli生成组件修改css成less或sass
使用cli命令生成组件:ng generate component 组件名生成出来的组件文件有:html / ts / css / spec.ts问题我是一个less重度患者怎么可能再去写css呢。于是我就在想使用cli生成组件的时候能直接生成出来的是less文件而不是css文件;修改angular-cli.json文件:apps "styles": [原创 2017-05-18 18:33:25 · 7303 阅读 · 0 评论 -
angular路由移除#号(跟nginx)
刚进公司,公司使用的angular.js(1.3.0),主管跟我说要我移除angular项目访问路径URL里的#号移除(针对百度seo问题后来发现angular天生不适合做seo)。(移除后觉得很简单)angularjs框架定义了前端路由控制器,通过不同的url实现单页面(ng-app)对视图ng-view的部署刷新。默认情况下:angular是不启动html5模式的,url中就会包括一个原创 2016-05-30 23:22:24 · 4312 阅读 · 0 评论 -
AngularJS中ng-repeat对象的问题
数组如下:{"all": "所有订单", "completed": "交易成功", "pay": "待付款", "deliver": "待交付", "complete": "待完成", "rank": "待评价", "cancelled": "交易取消"}通过ng-repeat去循环数组,当时得到的顺序必不是原数组的顺序。如图:ng-repeat这里进行的操作:对于类型的k原创 2016-06-27 19:29:06 · 4151 阅读 · 0 评论 -
angular1x初始与架构演进(四)gulp配置+OcLazyLoad中资源MD5时间轴更新
个人不是很喜欢非覆盖式更新这个模式:在一个版本中资源会出现不同的时间轴版本,而且这些版本会一直存在,导致项目越来越大,至于管理这个功能其实git就有提供,webstrom也有提供历史记录,所以这种模式并不是很重要。var gulp = require('gulp'), less = require('gulp-less'), browserSync = require('bro原创 2017-01-09 01:13:30 · 1978 阅读 · 0 评论 -
angular1x初始与架构演进(三)Ui-Router+OcLazyLoad加载模块
七月份的时候有写过一篇OcLazyLoad文章,当时只是初略了解了一下,是为了解决当前项目加载模块过多的问题,但是最后发现项目中模块间耦合性过于复杂,然后项目给出的时间也不是很多,后面就放弃了,这次新项目中使用了。加载js+css:angular.module('myRouters', ['ui.router', 'oc.lazyLoad']) .config(['$statePr原创 2017-01-08 23:41:04 · 3211 阅读 · 0 评论 -
angular1x初始与架构演进(二)
很荣幸第二个项目全权是由我负责的,推进了公司前端技术架构:CDN:js全部cdn通过时间轴来进行区域覆盖更新OcLazyLoad:Angular按需加载模块js,Angular也可以通过requirejs进行按需加载,我选择最简单Gulp:通过监控js,less源文件变化,编译压缩生产min版本,自动更新页面时间轴,采取非打包模式,个人习惯导致Git:svn在开发环境下,后原创 2017-01-08 12:14:59 · 1361 阅读 · 0 评论 -
angular1x初始与架构演进(一)
angular的亮点:双向数据绑定,指令,路由,服务,过滤器,依赖注入angular的缺点:相对应学习的东西也过于复杂,不适合seo,虽然可以通过搭建静态服务器来解决这个问题要学会angular最重要的是转换理念:数据驱动,数据发生了变化页面也会发生相应的变化,相反依然。前端技术架构体系:Angular1x的教程现在感觉有点误导初学者,spa框架一次加载所有资源,如果是原创 2017-01-07 22:09:09 · 1947 阅读 · 0 评论 -
angular下载二进制Excel文件
$http({ url:'', method: "POST", data: '', //this is your json data string responseType: 'arraybuffer' }).success(function (data, status, headers原创 2017-01-04 13:56:34 · 2307 阅读 · 0 评论 -
angular指令:tm.tags添加/删除标签
一个添加删除标签angular指令:在网上找了几个标签插件都不是angular的,而且过于庞大,最小的也要30kb还引用了其他样式。最后实在受不了自己写了,花4个小时找插件,最后自己2小时写完了。css+js 一共3kb demo地址 github地址原创 2016-12-15 17:16:28 · 1095 阅读 · 0 评论 -
angular分页插件tm.pagination
angular分页插件tm.pagination(解决触发二次请求的问题)根据条件查询需要重新定义一个方法$scope.so = function () { if ($scope.paginationConf.currentPage != 1) $scope.paginationConf.currentPage = 1;原创 2016-09-09 21:00:19 · 8511 阅读 · 0 评论 -
angular微信支付实际url地址不同
最近项目在微信内打开微信支付出现了问题好吧,国庆前是正常的,于是开始排查问题,发现在支付页面使用的支付url并不是该页面的,所以导致支付失败了比如:支付页面是xxx.com/shop/order 但是在提交微信支付的时候页面链接却是当初打开的页面xxx.com/index,是上次打的页面这个问题是如何造成的?应该是spa应用的问题,angular是属于spa应用也就是单页面,页面跳原创 2016-10-11 13:36:05 · 2054 阅读 · 0 评论 -
angular2-package.json解析
{ "name": "angular2-quickstart", "version": "1.0.0", "scripts": { "start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ", "lite": "lite-server", "postinstall": "typings i原创 2016-09-20 19:21:32 · 4125 阅读 · 0 评论 -
Angular-Ui-Router+ocLazyLoad动态加载脚本
在使用angular过程以前同事是采取一次性加载方式,在index页面一次性加载所有的js跟css,这种加载方式只适合教学和小型项目中,中大型不建议使用,加载速度影响到用户体验。在使用了Ui-Router以后,我第一想法就是把每个功能组件化,在请求视图的时候再去加载该页面js和css,index页面主要加载必须文件:angular.js于是尝试了下,这样去写,但是发现angular报错,原原创 2016-07-08 16:23:12 · 4647 阅读 · 6 评论 -
AngularUI Router
UI-Router是一个让开发者能够根据URL状态或者说是‘机器状态’来组织和控制界面UI的渲染,而不是仅仅的只改变路由(传统AngularJS应用实用的方式)。该模块为开发者提供了很多视图(View)额外的控制。开发者可以创建嵌套分层的视图、在同一个页面,使用多个视图、让多个视图控制某个视图等更多的功能。在页面引用:将UI-Router注入到住主程序: angular.modu原创 2016-07-08 14:56:59 · 532 阅读 · 0 评论 -
Angular双向数据绑定原理
Angular是通过脏检测来进行双向数据绑定Angular比不是通过定时去进行检测Angular在$digest cycle流程里面,会从rootscope开始遍历,检查所有的watcher。Angular只有指定事件触发,才会进入$digest cycle:1.DOM事件,比如用户输入文本,点击按钮等.2.ajax事件3.浏览器location变更事件4.Time原创 2016-06-29 19:13:12 · 2173 阅读 · 0 评论 -
angular-ng-repeat不允许collection中存在两个相同Id的对象
报错如下angular.js:13424 Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: {{x}} 在循环里加上track by $index 数组中是不允许存原创 2016-04-15 14:52:27 · 1465 阅读 · 0 评论 -
angular input回车事件
{{x}} var app = angular.module('myApp', []); app.controller('myctrl', function ($scope) { $scope.list1 = ['1', '2', '3']; $scope.mykey = function (e) { v原创 2016-04-15 15:45:49 · 8329 阅读 · 0 评论