Angularjs实战
收藏

Angularjs的基础教程太多,真正企业级开发会遇到的很多坑,所以把自己使用Angularjs开发遇到的坑,和怎么解决的方法写出来,供大家参考。

分享到: Sina Tec

最近更新文章

Angularjs自定义指令计算浏览器高度

<!DOCTYPE html> <html ng-app="app"> <head> <title>柳絮飞祭奠</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> ...
 
柳絮飞祭奠 评论(0) 有907人浏览 2018-03-27 21:51

$q的基本用法

angularjs的http是异步的没有同步,一般都会遇到一个场景,会把异步请求的参数作为条件执行下一个函数,之前一直在看其他人的博客理论太多看了很久才看懂 http({ method:'post', url:'aaa', }).success(function(data){ $scope.flag=true; }); ...
$q 
柳絮飞祭奠 评论(0) 有1045人浏览 2018-02-04 16:29

Angularjs的directive封装ztree

一般我们做web开发都会用到树,恰好ztree为我们提供了多种风格的树插件。 接下来就看看怎么用Angularjs的directive封装ztree <!DOCTYPE html> <html ng-app="ceshiapp" ng-controller="ceshicontroller"> <head> < ...
柳絮飞祭奠 评论(0) 有1280人浏览 2017-12-16 13:41

AngularJS中$interval和$timeout的使用

我们在项目中会出现定时刷新,延迟加载等多种场景。 接下来就看$interval和$timeout的使用 $interval可用于定时任务,我们只需在controller注入$interval即可使用.下面是每十秒钟执行一次alert()函数。 app.controller("ctrl", function($scope,$timeout,$interval) { $in ...
柳絮飞祭奠 评论(0) 有1230人浏览 2017-11-18 12:49

AngularJS实战之ngAnimate插件实现轮播

第一步:引入angular-animate.js 第二步:注入ngAnimate var lxApp = angular.module("lxApp", [ 'ngAnimate' ]); 第三步:定义controller,设置好三张轮播图片 .z_login_bg1 { position: absolute; width: 100%; height: 100% ...
柳絮飞祭奠 评论(0) 有1695人浏览 2017-11-08 21:44

AngularJS实战之Controller之间的通信

我们时常会在不同controller之间进行通信,接下来就介绍三种controller之间的通信方式 一、使用$on、$emit和$broadcast进行controller通信 虽然AngularJS是不推荐使 ...
柳絮飞祭奠 评论(0) 有1363人浏览 2017-10-22 23:13

AngularJS监听数组变化

我们在使用angualr的监听时候,业务的需要我们会去监听一个数组的某一个值得变化,再写逻辑代码。然而我们在使用$scope.$watch(“”,function(){ })时候会发现不管用,这是由于$scope.$watch是有三个参数的,默认情况下是 $scope.$watch(“”,function(){ },false),只是去监听数组的地址是否发生变化,当我们要去监听数组的某一个值时候,需 ...
柳絮飞祭奠 评论(0) 有1074人浏览 2017-10-22 12:55

AngularJS的$location基本用法和注意事项

一、配置config app.config([ '$locationProvider', function($locationProvider) { $locationProvider.html5Mode({           //设置为html5Mode(模式),当为false时为Hashbang模式 enabled : true,           //是否需要加入base标签,这里设 ...
柳絮飞祭奠 评论(0) 有1256人浏览 2017-10-16 15:31

AngularJS 无限滚动加载数据控件 ngInfiniteScroll

在开发中我们可能会遇到滚动鼠标到浏览器底部实现数据的加载,js和jquery实现都不复杂都是既然AngularJS提供现成的我们怎么不用昵。 ng-infinite-scroll.js这个组件则可以实现: ng-infinite-scroll.js:下载地址:http://sroze.github.io/ngInfiniteScroll/ 使用: <!DOCTYPE html> < ...
柳絮飞祭奠 评论(0) 有1935人浏览 2017-10-13 22:03

AngularJS实战之ng-repeat的详细用法

一、基本语法 {{$index}}:获取元素的下标。 {{$first}}:判断当前元素是否是第一个元素,是则为true,否则:false; {{$last}}:判断当前元素是否是最后一个元素,是则为true,否则:false; {{$middle }}:判断当前元素是否是中间元素,,是则为true,否则:false; {{ $odd}}:判断当前元素是否是奇数,,是则为true,否则:false; ...
柳絮飞祭奠 评论(0) 有1849人浏览 2017-10-13 21:23

ng-show和ng-if的区别和使用场景

一、ng-show(ng-hide)和ng-if都是控制标签的显示和隐藏,为什么angularjs会定义两个指令来供我们使用呢,不多多说肯定有各自的使用场景,接下来我们看哈实际原理: ng-show实质性就是控制标签的显示和隐藏,内部是display: none; ng-if则是移除标签和插入标签:; 二、实际比较 定义三个div <div ng-show="true"& ...
柳絮飞祭奠 评论(0) 有1618人浏览 2017-10-11 23:31

AngularJS实战之路由ui-view传参

angular路由传参 首页 <!DOCTYPE html> <html ng-app="app"> <head> <title>路由传参</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyw ...
柳絮飞祭奠 评论(0) 有1190人浏览 2017-08-25 00:50

AngularJS实战之filter的使用二

博文一中的filter是angular自带的filter,一般不会满足我们的使用。我们可以自定义filter。 一、自定义filter实现反转字符串 <div>{{ceshi|reverse}}</div> app.filter('reverse', function() { return function(text) { return text.split( ...
柳絮飞祭奠 评论(0) 有957人浏览 2017-08-24 23:01

AngularJS实战之filter的使用一

一、格式化数字为货币格式。 <div>{{money|currency:"$"}}</div> <div>{{money|currency:"RMB"}}</div> script: app.controller("crl", function($scope, $filter) { ...
柳絮飞祭奠 评论(0) 有855人浏览 2017-08-24 22:36

AngularJS实战之路由ui-view

1. 路由(ui-router) 1.1. 环境 1) angular.min.js 2) angular-ui-router-0.2.10.js 3) 确保确保包含ui.router为模块依赖关系. 4) var app=angular.module("app",['ui.router']); 1.1. 视图激活方式 1) $state.Go():优先级较高的便利方式 2) ...
 
柳絮飞祭奠 评论(0) 有955人浏览 2017-08-18 01:15
  • 专栏创建者:柳絮飞祭奠
  • 创建时间:2017-10-12 00:13:54
  • 专栏文章数:15篇
  • 专栏被浏览:19209 次

本专栏热门文章

最新评论

Global site tag (gtag.js) - Google Analytics