angular技术手札
对angularJS常用技术点整理
GothaM24
言出子口,入于吾耳,何以言未
展开
-
AngularJS 中a标签unsafe导致的一系列问题。
一个很小很小的bug,明知道很小,但是就是小到找了两个小时,一点都不夸张,此处记录下。AngularJS为了安全检查功能给a标签的href默认成unsafe(很变态有木有)案例使用directive定义的公用头部组件:<body ng-controller="mainController"> <otham-head></otham-head><...原创 2019-12-19 19:13:53 · 431 阅读 · 0 评论 -
AngularJS实例,含源码
实现功能:①AngularJS内置服务filter完成模糊搜索②AngularJS ng-model+ng-checked+ng-change实现单、全、反选③基于css3的伪类before+after完成checkbox美化④依赖注入ng-layer实现AngularJS+LayerJS传参源码地址:https://download.csdn.net/download/qq_35593...原创 2019-12-02 15:27:11 · 353 阅读 · 0 评论 -
AngularJS 之input checkbox全选、反选简单写法
我们在使用jQuery或者原生JS全选反选功能使用type="checkbox"自带属性checked来完成,当然AngularJS一样可以通过ngChecked或者ngModel配合ngChange完成需求。正文开始:最完整的checkbox全选/反选需求:①点击列表头部全选按钮完成表格中所有checkbox全部选中或者全部不选②当表格中至少有一个未选中时,表头中的checkbox状...原创 2019-12-02 14:09:16 · 719 阅读 · 1 评论 -
AngularJs表单验证
能够根据用户在表单中输入的内容给出实时视觉反馈是非常重要的。在人与人沟通的语境中,表单验证给出来的反馈同获得正确输入同等重要。表单验证不仅能给用户提供有用的反馈,同时也能保护我们的Web应用不会被恶意或者错误的输入所破坏。我们要在Web前端尽力保护后端。AngularJs能够将HTML5表单验证功能同它自己的验证指令结合起来使用AngularJs提供了很多表单验证指令,主要列举其中一些核心的...原创 2019-12-02 13:39:30 · 123 阅读 · 0 评论 -
AngularJs配合Jquery操作DOM
我们在使用AngularJs开发时,某些时候需要主动操作dom,Angular配合Jquery能完成和Jquery高度相似的操作前提:引入Jquery且需在AngularJS之前引入Jquery。不然会导致报错: Error: [jqLite:nosel]以下列举常见的DOM操作:addClass()-为每个匹配的元素添加指定的样式类名after()-在匹配元素集合中的每个元素...原创 2019-11-29 11:14:04 · 309 阅读 · 0 评论 -
AngularJs深入理解表达式
表达式在AngularJs应用中广泛使用,因此深入理解AngularJs如何使用并运算表达式是非常重要的。表达式的示例,用{{ }}符号将一个变量绑定到$scope对象上的写法本质上就是一个表达式{{ expression }}。当用$watch监听时,AngularJs会对表达式或者函数进行运算。表达式和eval(Javascript)非常相似,但是由于表达式由AngularJs处理,他们有...原创 2019-11-27 14:58:18 · 153 阅读 · 0 评论 -
AngularJs作用域 $scope
作用于($scope)是构成AngularJs应用的核心基础,在整个框架中都被广泛应用。应用的作用域是和应用的数据模型相关联的,同时作用域也是表达执行的上下文,$scope对象是定义应用业务逻辑、控制器方法和视图属性的地方。作用域是视图和控制器之间的胶水,在应用将视图渲染并呈现给用户之前,在视图的模板会和作用域进行连接,然后应用会对DOM进行设置以便将属性变化通知给AnguarJs,这个功能让...原创 2019-11-27 13:38:56 · 392 阅读 · 1 评论 -
AngularJS与浏览器基础
前言:本文主要帮助熟悉与AngularJS有关的一些术语和技术,以及它们背后相关的工作原理。即使以前从来没有接触过AngularJS,通过将零碎的知识点组合在一起,你也可以构建一个属于自己的AngularJS应用。1、浏览器如何获取网页我们把互联网想象成一个邮局:当你想给朋友写信时,首先要把内容写在一张信纸上,然后在信封上写上地址,再把信纸装进信封。当你把信送到邮局,邮件分拣机构会根据邮编和...原创 2019-11-26 14:09:56 · 225 阅读 · 0 评论 -
AngularJs之$filter详解
过滤器(filter)正如其名,作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果。主要用在数据的格式化上,例如获取一个数组中的子集,对数组中的元素进行排序等。ng内置了一些过滤器,它们是:currency(货币)、date(日期)、filter(子串匹配)、json(格式化json对象)、limitTo(限制个数)、lowercase(小写)、uppercase(大写)、num...原创 2019-11-25 14:29:41 · 1730 阅读 · 0 评论 -
AngularJs中的JS文件拆分管理。
拆分代码一般对可维护性是有好处的,但要注意这些事情:1、从理念上讲,拆的是逻辑而不是文件,如果把逻辑拆分理清了,拆不拆文件的重要性并不大。如果对可维护性的提升是100%,逻辑的部分至少要占90%。2、写Angular应用,最重要的事情是分层。很多人写不好Angular代码,原因就是没有分层的观念,所以症状就是controller又大又乱。简单的原则是:3、远程请求,数据缓存等等一律...原创 2019-11-22 13:49:01 · 393 阅读 · 0 评论 -
AngularJs依赖注入$service、$factory、$provider详解
前言1、依赖注入的逼格用有过JAVA spring的人都知道,Spring的核心思想就是DI(依赖注入,Dependency Injection)和IOC(控制反转 Invension of Controller),AngularJS的service其实就是用到了这里的DI思想,那么什么叫做DI?所谓DI,就是指对象是被动接受依赖类而不是自己主动去找,换句话说就是指对象不是从容器中查找它依赖...原创 2019-11-22 10:28:19 · 599 阅读 · 0 评论 -
Angular中$http解析、简单封装手札
$http服务1、$http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。2、angular内置的$http服务简单的封装了浏览器原生的XMLHttpRequest对象,可以直接同外部进行通信。3、$http服务只能接受一个参数,且该参数是一个对象,这个对象主要包含一些http请求的配置内容。如下:var req = { method: 'POST', ...原创 2019-11-21 14:26:10 · 644 阅读 · 0 评论 -
Angular之$scope生命周期和$filter过滤器
一、scopescope是一个把view(页面或者模板中DOM元素)连结到controller上的对象)<p ng-bind="txt"></p>var app = angular.module('myApp',[]) app.controller('myCtrl',function($scope){ $scope.txt = '佛系四大皆空'; })...原创 2019-11-21 10:54:11 · 492 阅读 · 0 评论