总结—angularjs项目】的更多相关文章

本博客停止更新,请访问新个人博客:owenchen.net 前言 博客迁移到了BAE上,http://owenchen.net/,以后的文章会首发在自己的博客上,随后在博客园发布. 很久没有写文章了,一是项目比较忙,二来自己在尝试一些互联网新的产品,以微信平台开发为主,看看能不能挣点零花钱以缓解目前的经济压力,也顺便了解和学习一下为什么这东西这么火.最终钱还没挣到,到把自己累个半死.当然收获也是有的,发现了一些挣钱的路子,以后有时间有机会尝试尝试.也在短时间内玩了不少东西,比如PHP的mvc框架…
Yeoman是什么? Yeoman按照官方说法,它不只是一个工具,还是一个工作流.它其实包括了三个部分yo.grunt.bower,分别用于项目的启动.文件操作.包管理. Yo: Yo是一个项目初始化工具,可以生成一套启动某类项目必需的项目文件. Bower: 一个客户端技术的软件包管理器,它可用于搜索.安装和卸载如JavaScript.HTML.CSS之类的网络资源. GruntJS: GruntJS是基于JavaScript的命令行构建工具,它可以帮助开发者们自动化重复性的工作. 安装 基于…
自从上一篇文章到现在已经有将近一个月的时间,我将精力放在了前端页面分解与组装,和angularjs如何与jquery.bootstrap.D3等一系列其他类库结合使用的经验总结上.由于公司新招了一些员工,对于我而言快速的做出demo页面用以示范,是让新人快速上手的最佳方案.即使这段时间工作较忙,写这样大段文字的时间确实不好找,但我依然必须勤做记录,否则灵感如昙花一现转瞬即逝,如何带领新人,推动项目?故而我只能知无不言,把我所关注过的大小重点都记录下来. 那么接下来我先讲讲用angularjs如何…
AngularJs项目实践总结 今年3月接触AngularJs,并且在6月的项目中开始应用,从踩坑到填坑花了不少时间,根据项目中的实际应用情况总结了一些经验,如下: 一.UI控件选择 Angularjs是不缺控件的,Github里现成的控件非常丰富,基本上足以应付一个普通管理系统中常见的控件需求.但是控件的丰富会带来选择的困难.选择控件要满足几个原则:原则1:符合业务场景原则2:控件持续更新原则3:满足性能要求 举几个例子.首先是上传附件的控件.项目中要用到附件上传,谷歌上搜到了三个控件,分别是…
近日来我有幸主导了一个典型的web app开发.该项目从产品层次来说是个典型的CRUD应用,故而我毫不犹豫地采用了grunt + boilerplate + angularjs + bootstrap + D3 + requirejs 的架构来实现它.angularjs早在去年6月份我就有所接触,将它应用在实验室项目的个别页面中,11月份在新浪的时候也将其推荐给了所在云事业部项目组.项目组老大程辉等人都是很有技术敏感性的人,大胆地采纳了我的建议,将之应用于原本使用dojo开发的项目前端模块上.然…
Spring Boot 是由 Pivotal 团队提供的全新框架,其设计目的是用来简化新 Spring 应用的初始搭建以及开发过程.该框架使用了特定的方式来进行配置,从而使开发人员不再需要定义样板化的配置. 本文主要是记录使用 Spring Boot 和 Gradle 创建项目的过程,其中会包括 Spring Boot 的安装及使用方法,希望通过这篇文章能够快速搭建一个项目. 1. 开发环境 操作系统: mac JDK:1.7.0_60 Gradle:2.2.1 IDE:Idea 2. 创建项目…
AngularJS项目开发技巧之利用Service&Promise&Resolve解决图片预加载问题(后记) 前言 在"AngularJS项目开发技巧之图片预加载"一文中,自己曾经天真的认为提升服务端带宽就可以解决图片加载问题.但自己的想法错了,通过阅读破狼的书<AngularJS深度剖析与最佳实践>,隐隐察觉到是自己的项目架构出现了问题.存在很多待优化的地方.其书中这样写到"如果在实例化控制器之前,需要准备一些特定数据,或者有条件的阻止进入路由,…
AngularJS项目开发技巧之获取模态对话框中的组件ID 需求 出于项目开发需求,需要实现的业务逻辑是:药店端点击查看"已发货""已收货"订单详情时,模块弹出框中只应出现"取消"按钮.但现实的情况如下图所示. 模态框核心代码如下: <script type="text/ng-template" id="billDtlContent.html"> <div class="moda…
AngularJS项目开发技巧之图片预加载 绪 项目(移动端采用Ionic 框架)开发完毕,测试阶段发现移动APP首页的广告图片(图片由服务器端返回相应url地址)很难加载,主要原因还是网速.如下图左所示,图片加载完毕如下图右所示.             问题分析 尝试进行图片加载的优化工作. 经过与Ionic群内卖火柴朋友的聊天,获取到如下内容:手机端访问速度受服务端带宽的限制.一个接收一个传输,和两方都有关系.服务器对app影响是很大的.2M 一般是网站使用还可以  app会不乐观.增加服…
AngularJS项目开发技巧之localStorage存储       注: localStorage深度学习 绪 项目开发完毕,测试阶段发现后台管理端二维码生成有问题,问题在于localStorage的存储.如下图左所示,二维码生成完毕包含信息如下图左所示,实际二维码信息如下图右所示: 经过测试发现二维码实际存储的是上一次的结果.好熟悉~Bingo,自己做导航栏高亮时就遇到过这个问题,当时就是使用的localStorage.问题还是出在localStorage身上.但是存储时:localSt…
今年3月接触AngularJs,并且在6月的项目中开始应用,从踩坑到填坑花了不少时间,根据项目中的实际应用情况总结了一些经验,如下: 一.UI控件选择 Angularjs是不缺控件的,Github里现成的控件非常丰富,基本上足以应付一个普通管理系统中常见的控件需求.但是控件的丰富会带来选择的困难.选择控件要满足几个原则:原则1:符合业务场景原则2:控件持续更新原则3:满足性能要求 举几个例子.首先是上传附件的控件.项目中要用到附件上传,谷歌上搜到了三个控件,分别是https://github.c…
angularjs,在我看来是个中等重量级的框架.即不像backbone那么简单,也不像dojo和Yui那么包罗万象.很多时候,妄图包罗万象,往往会出现很多子模块的质量高不成低不就,并且修改起来较为困难.过分精简,则框架内容单薄需要写的内容太多.angularjs这种相对中庸的风格,则非常符合我的需求. 目前,AngularJS三个我认为最为精妙的组件就是数据绑定(Scope),指令(Directive)和依赖注入(Dependency Injection),表现得非常好.相对而言,它的UI组件…
关于angularjs.requirejs的基础知识请自行学习 一.简单事例的项目目录如下: -index.html -scripts文件夹 --controller文件夹 --- mianController.js --- controller1.js ---controller2.js --directives文件夹 ---mainDirective.js ---directive.js --app.js --router.js --main.js 二.首页 首先你的index.html大概…
最近有写一个电子订单商务网站,使用JAVA8,SPRING,ANGULARJS对项目使用的技术和大家分享. 第一次写博客,哪有不对需要改正的请联系改正. 因为是项目是我给别人做的无法提供源码见谅,我尽最大努力让大家能看懂. 首先从项目的构建开始,我采用的gradle构建项目,使用的版本是2.4. 开发环境用的IDEA 14,项目数据库使用的是SQL SERVER. Spring Boot 技术文档:http://docs.spring.io/spring-boot/docs/current/re…
上一篇文章中我花了很多口舌去介绍angularjs是一个中型框架,面对大型应用时少不了第三方类库的配合.而我的核心议题是:如何以angularjs的思路使用其他类库,这里jquery是最好的例子了,谁让它争议最大.许多人一看到jquery就火冒三丈冲过来觉得这货是影响代码结构.打破angular way的纯洁的罪魁祸首,但事实是好的木匠总是会允许烂木头的存在,何况jquery并非烂木头.只要配合得当jquery完全可以做你项目中的小伙伴,而如果不改变传统的思路,就算用了angularjs你的代码…
引言:angularjs是一个中等重量级的前端开发框架 HTML是一门很好的为静态文本设计的语言,但要构建动态的web应用它就显的乏力了.通常,我们使用以下技术来解决静态网页技术在构建动态应用上的不足: 1.类库:类库是一类函数的集合,它能帮助你写web应用.这里起主导作用是你的代码,由你来决定何时使用类库.典型的类库,例如prototype.jquery等. 2.框架:框架式一种特殊的.已经实现的web应用,你只需要填充具体的业务逻辑.这里框架是起主导作用的,由它根据具体的逻辑来调用你的代码.…
链接:https://www.zhihu.com/question/33565135/answer/696515Angular页面传参有多种办法,根据不同用例,我举5种最常见的:PS: 在实际项目中,请参照https://github.com/johnpapa/angular-styleguide优化您的代码.1. 基于ui-router的页面跳转传参(1) 在AngularJS的app.js中用ui-router定义路由,比如现在有两个页面,一个页面(producers.html)放置了多个p…
转至https://yq.aliyun.com/articles/25578 Yeoman 介绍 Yeoman 是 Google 的团队和外部贡献者团队合作开发的,他的目标是通过 Grunt(一个用于开发任务自动化的命令行工具)和 Bower(一个HTML.CSS.Javascript 和图片等前端资源的包管理器)的包装为开发者创建一个易用的工作流. Yeoman 的目的不仅是要为新项目建立工作流,同时还是为了解决前端开发所面临的诸多严重问题,例如零散的依赖关系. Yeoman 主要有三部分组成…
我毕业了-------有点期待生活,又点害怕生活. 总结下最近一个月做的这个项目,项目的开发形式也比较新颖,采用的是前后端分离的形式.我负责前端的管理系统开发,另一个哥们负责利用ABP创建接口,整合后端代码,供前端访问,为其提供数据.前端采用angularjs来开发,之前学习过一点,但是好长时间没有使用,很多都忘记了,导致严重耽误了开发周期.看来以为新学习的东西还是要多使用,多了解.这次还有一个收获是对于我来说很有帮助,那就是学会写工作日志.按照“今日内容”.“明日计划”.“难点”这三个维度来写…
目录 啰嗦一下 你问我答 目录结构 压缩 其他 啰嗦一下 最近在开发一个项目时,调研了一下AngularJS,发现这个框架功能很丰富,而且用起来也很方便,所以深入了解了一下,在此分享一下我的感悟. AngularJS是一个MVVM框架,所谓MVVM框架,即:Model-View-ViewModel,通俗一点的解释是:当数据发生变化时,框架自动进行数据绑定,自动更新页面上的数据. 这一点可以说是非常"神奇"的功能,可以减少我们很多的工作量.把我们从复杂的DOM结构中解脱出来,用剩余的时间…
1).按钮loading --TODO 2). page loading状态 1.在module中注入指令 // Route State Load Spinner(used on page or content load) app.directive('ngSpinnerLoader', ['$rootScope', function ($rootScope) { return { link: function (scope, element, attrs) { // by defult hid…
项目中有一页是显示全国地图, echarts官网的地图实例里,有一个模拟迁徙的实例,比较符合项目需求.所以大部分配置项是参考此实例. angular 就不过多介绍了, Google出品的mvc(或者说mvvm)框架. 双向数据绑定,指令等特性很好用. echarts 是百度的开源图表插件, 功能丰富,展示形式多样. 首先定义一个directive .directive('echartsMap', ['$timeout', function ($timeout) { return { restri…
/** *普通ajax请求公共服务 */ mainModule.factory('myService',function($http,$q){ var service = {}; var baseUrl = '../'; var _url = ''; var _finalUrl = ''; var _token = ''; /** * 处理请求路径 */ var makeUrl = function(){ _url = _url.split(' ').join('+'); _finalUrl =…
AngularJS从构建项目开始 AngularJS体验式编程系列文章,将介绍如何用angularjs构建一个强大的web前端系统.angularjs是由Google团队开发的一款非常优秀web前端框架.在当前如此多的web框架下,angularjs能脱颖而出,从架构设计上就高人一等,双向数据绑定,依赖注入,指令,MVC,模板.Angular.js创新地把后台技术融入前端开发,扫去jQuery一度的光芒.用angularjs就像写后台代码,更规范,更结构化,更可控. 关于作者 张丹(Conan)…
java8+spring+angularjs 项目应用 最近有写一个电子订单商务网站,使用JAVA8,SPRING,ANGULARJS对项目使用的技术和大家分享. 第一次写博客,哪有不对需要改正的请联系改正. 因为是项目是我给别人做的无法提供源码见谅,我尽最大努力让大家能看懂. 首先从项目的构建开始,我采用的gradle构建项目,使用的版本是2.4. 开发环境用的IDEA 14,项目数据库使用的是SQL SERVER. Spring Boot 技术文档:http://docs.spring.io…
基于项目实战解析ng启动加载过程 前言 在AngularJS项目开发过程中,自己将遇到的问题进行了整理.回过头来总结一下angular的启动过程. 下面以实际项目为例进行简要讲解. 1.载入ng库 2.等待,直到DOM树构造完毕. 3.发现ng-app,自动进入启动引导阶段. 4.根据ng-app名称找到相应的路由. 5.加载默认地址. 6.Js顺序执行,加载相应模版页 sys_tpls/home.html 7.在此,可以看到index路由中只是填充了ui-view为sys_login的div模…
[Angularjs] 第一步开始一个项目 一.什么是angularjs angularjs是2009年兴起的,目前由Google维护一个采用mvc模式的js框架,很多时候用来创建单页面应用.我也经常将其和phonegap一起来开发webapp. 二.Angularjs项目结构 通常代码可以这样:index.html 第一个js文件(angular.js)是核心文件,必须有.而其他angular-*.js都是功能文件,如果项目不需要使用到可以不引用的. app.js文件是对angular应用的定…
Angularjs架构搭建      1.搭建Angularjs项目           1)在package.json中配置如下,然后 npm install下载包     {   "name": "angularjst",   "version": "1.0.0",   "description": "轮子",   "author": "Dengwh&q…
前沿 最近在angularjs项目当中,看到 controller 好多都是重复性的代码,在 controller 当中有好多代码很相似 function(比如 controller 下的 CRUD 方法),重复性工作太多.后来想,可不可以提出一个service ,但仔细想想,这些CRUD 本来就是从 Service 中调用的,如果在提出Service,会造成 Service 比较混乱,职责不清晰 . 因为自己做过一些后端,借助后端的思想,是不是可以 controller 继承. \(contr…
AngularJS介绍–AngularJS的前世今生 AngularJS是什么 在Web开发领域,我们一般使用HTML作为前端页面元素的声明式语言,使用CSS技术作为展示样式的描述语言,JavaScript作为业务处理交互的命令式语言.当我们构建非常复杂的Web应用时,纯粹而有限的HTML就显得非常不足,Javascript本身也会随着项目代码量的膨胀而难以维护和管理,研发工期和成本也会随之难以控制.这时候,我们一般使用一些类库(例如jQuery.Dojo等)或框架(例如Backbone.Emb…