angular
Take_Dream
热爱前端开发
展开
-
Angular的daterangepicker日历插件常用配置
1、首先需要引用的文件2、紧接着再定义HTML和初始化js就可以展示日历了3、再为“开始”按钮绑定事件日历就可以展示了///设置日历默认选中哪天 $scope.listFilter="2016-12-16"; ////日历初始化选项 $scope.dateOptions = { formatYear: 'yy', startingDay:原创 2016-12-16 17:24:21 · 8713 阅读 · 0 评论 -
javascript处理json/base64等数据并且下载成本地json/image文件(angular环境、execCommand)
github地址:https://github.com/chuanzaizai/execCommand_downlaod1、最近项目有这样一个需求:后端返回json字符串、base64数据,前端处理并且下载成本地文件2、技术栈: angular、window.navigator.userAgent、document.execCommand(IE浏览器)、a标签的download属性3、原创 2017-09-05 18:37:41 · 1411 阅读 · 0 评论 -
angular中ng-mouseenter、ng-mouseleave的时间差导致dom闪屏问题(timeout可缓解)
1、现在比如有两个独立的平级模块,要实现鼠标移入nav-wrapper、list-wrapper显示list-wrapper,移出则隐藏(1)显示所有导航(2)导航列表2、js代码// 初始化为false$scope.showList = false;// 鼠标移入$timeout(functon(){ $scope.showList = true;},原创 2017-09-04 09:20:43 · 1821 阅读 · 0 评论 -
angular初学者福利啦(列表增、删、改)
1、废话少说、直接上代码html页面:user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">angular测试添加列表内容序号姓名年龄手机号操作删除修改原创 2016-08-21 10:51:14 · 2255 阅读 · 0 评论 -
AngualrJS实现表单验证
1、HTML代码用户名:用户名不能为空邮箱:邮箱不能为空非法的邮箱地址密码:密码必须由数字和字母组成2、JS代码var app=angular.module("myApp",[]);app.controller("validateCtrl",f原创 2016-05-10 12:13:04 · 801 阅读 · 0 评论 -
AngularJS学习-(左侧导航栏筛选、input输入框筛选)
1、HTML代码 首页 {{nav.classify}} {{product.name}} {{product.describe}}原创 2016-05-17 10:38:29 · 5729 阅读 · 1 评论 -
angular实现将三目运算写入HTML中
////////数据来源:module.enable由后台循环生成,默认显示0或1 给span标签绑定ng-bind="module.name",优于{{module.name}},避免页面初始加载出现{{}}原创 2016-07-07 15:52:38 · 7567 阅读 · 0 评论 -
angular实现页面跳转,并且刷新页面(重新请求后台接口)
1、在controller中注入$state2、语法:$state.go("目标路由",{},{reload:true})3、在目标路由(router)中配置cache:false(禁用缓存)原创 2016-08-02 17:04:04 · 16099 阅读 · 1 评论 -
angularjs取到 My97DatePicker选中的值
提示:直接在页面调用不能取到input的值,需要封装成指令1、第一步 引入My97DatePicker的插件,不要改变js/css/img目录结构2、第二步 指令封装3、第三步4、第四步controller文件定义参数 $scope.datas={};原创 2016-08-07 20:20:15 · 3260 阅读 · 5 评论 -
angular定义promise异步处理值方式(超简单)
1、定义获取数据的公用方法function getData(url){var der=$q.defer(); //第一步:定义der$http(url).success(function(){der.resolve(data); //请求成功时,实现状态由未完成到完成}).error(function(){der.reject(data); //请求失败,声明状态原创 2016-08-10 17:24:52 · 3312 阅读 · 0 评论 -
angular实现列表按钮的权限控制(ng-if)
1、angular实现权限控制。区别于传统方式:例如ajax获取session,保存在客户端(ps不推荐:1.安全性 2.因为session在用户离开页面仍可以保存,会增大服务器的压力 )2、前提条件(个人亲身体会) 1、公司后台人员不要墨守成规,乐于使用简单正确的新技术(ps:很多公司后台还是叫前端取session) 2、并且后台要根据登录用户的权限查询数据库,并原创 2016-08-21 10:37:58 · 7907 阅读 · 4 评论 -
angular循环生成iconfont字体(ng-bind-html)
1、angular可通过这种模式调用阿里云字体 但是ng-repeat循环生成字体图标会报错2、解决方法(controller首先注入$sce)测试数据循环赋值html循环原创 2016-08-22 18:35:24 · 1534 阅读 · 0 评论 -
angular把echarts封装为指令(配合requirejs)
1、在require中配置echartsjs文件2、在directives下定义指令(定义为全局的指令,任何页面调用都可以)define(['app','echarts'],function(app,echarts){ app.register.directive('bar',function(){ return { s转载 2016-09-08 10:25:44 · 3288 阅读 · 0 评论 -
Angular中http请求后再执行封装的echarts指令($watch)
1、项目遇见的bug,http请求后填充echarts指令数据会报错2、解决方案,在指令中使用$watch监听和判断(1)指令中定义的变量(2)指令中添加$watch方法(注:所有的变量都要监听到)3、再次刷新页面时,echarts图标就会在http请求后渲染出来原创 2016-09-23 11:42:32 · 944 阅读 · 0 评论 -
r.js压缩angular项目,Angular+requirejs+rjs实现初始化http请求数的优化
先看一下我整个项目的文件目录截图(dist文件夹是项目压缩后的文件)1、正常情况下,仅仅使用angular+require,初次访问index.html,浏览器会加载:main.js里面配置的require插件模块+路由初始化默认模块(蓝色为默认路由模块)2、使用r.js,算是require的一个高阶应用(1)首先,下载r.js,下载链接:http://requirejs.原创 2016-10-31 13:46:30 · 1243 阅读 · 0 评论 -
jquery实现angular左侧导航栏,页面刷新仍选中
1、最近帮新来的同事写了一个基于angular项目的左侧导航栏,由于之前的导航采用ng-repeat生成,用angular事件处理,代码量较大项目用了阿里字体、jquery插件效果图如下:2、html代码如下(主要定义的导航的id,路由跳转)3、js代码(为一级导航、二级导航绑定事件,页面刷新仍选中导航)注:每次只能有一个导航处于展开状态原创 2016-11-30 16:22:21 · 4515 阅读 · 0 评论 -
Angular5初探之--构建一个简单的单页应用,包含登录(login)和几个一级菜单
1、项目目录结构为:@angular/cli标准目录结构,截图如下:2、src开发文件夹已经上传至github,需要的朋友可以参考 : https://github.com/chuanzaizai/Angular5_demo3、使用@angular/cli快速构建项目,可参考官方文档:https://cli.angular.io/4、使用@angular原创 2017-12-26 15:47:58 · 4289 阅读 · 0 评论