AngularJS
关注
分享
扫一扫
文章平均质量分 57
houyanhua1
这个作者很懒，什么都没留下…
展开
-
AngularJS $filter过滤器服务(数据格式化输出)
$filter过滤器服务：在$scope模型(Model)中实现数据格式化输出(可以实现视图中的所有内置过滤器)。demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title&原创 2018-04-30 10:35:59 · 334 阅读 · 0 评论 -
AngularJS 数据绑定,单向绑定 (ng-bind,{{}},ng-bind-template)
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-28 09:09:54 · 652 阅读 · 0 评论 -
AngularJS 数据绑定,双向绑定(ng-model)
数据双向绑定：视图上的数据通过表单元素绑定到Model模型($scope)上。 （用户只能通过表单元素输入数据）demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title&原创 2018-04-28 09:42:25 · 1611 阅读 · 0 评论 -
AngularJS ng-init 应用初始化时定义变量
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-28 10:03:29 · 4978 阅读 · 0 评论 -
AngularJS 事件绑定(ng-click)
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-28 10:31:56 · 8431 阅读 · 0 评论 -
AngularJS ng-repeat 遍历数组
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-28 10:54:41 · 1590 阅读 · 0 评论 -
AngularJS ng-switch[ on], ng-switch-when
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-28 11:10:55 · 742 阅读 · 0 评论 -
AngularJS 用angularJS实现tab栏切换 (ng-switch[ on])
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <style> nav a { display: inline-原创 2018-04-28 21:32:48 · 1706 阅读 · 0 评论 -
AngularJS 作用域
作用域(JS中的函数可以分割作用域。Controller相当于函数从而分割作用域)根作用域： ng-app指定的区域就形成了根作用域$rootScope子作用域原创 2018-04-29 10:15:28 · 185 阅读 · 0 评论 -
AngularJS 过滤器，9个内置过滤器
过滤器：{{数据|过滤器:参数}} 格式化展示数据。 "|"相当于管道，可以通过多个"|"来同时使用多个过滤器。 ":"表示参数,多个冒号多个参数。 demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"&g原创 2018-04-29 11:54:22 · 349 阅读 · 0 评论 -
AngularJS 自定义过滤器(filter())
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-29 16:42:24 · 228 阅读 · 0 评论 -
AngularJS 依赖注入
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-29 18:00:35 · 170 阅读 · 0 评论 -
AngularJS $location地址服务
服务:一个对象或函数，对外提供特定的功能。demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angul原创 2018-04-29 22:04:48 · 275 阅读 · 0 评论 -
AngularJS $timeout和$interval内置服务
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular.min.js"&g原创 2018-04-29 22:25:02 · 780 阅读 · 0 评论 -
AngularJS 内置指令(ng-xxx)
内置指令：以"ng-"开头的html标签属性。demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title> <style&原创 2018-04-27 18:28:58 · 815 阅读 · 0 评论 -
AngularJS 自定义指令(directive)
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title></head><body ng-app="App&原创 2018-04-27 21:03:44 · 223 阅读 · 0 评论 -
AngularJS $log日志服务
demo.html：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular原创 2018-04-30 10:54:41 · 1084 阅读 · 0 评论 -
AngularJS $http服务(发送Ajax异步请求)
demo.html：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular原创 2018-04-30 16:15:16 · 2560 阅读 · 0 评论 -
AngularJS $http服务实现跨域名访问(jsonp)
JQuery实现跨域名访问(jsonp)：https://blog.youkuaiyun.com/houyanhua1/article/details/79703731demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Angula原创 2018-04-30 18:14:21 · 484 阅读 · 0 评论 -
AngularJS 自定义服务, factory(),service(),value()
demo.html（factory方法实现）：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>AngularJS</title> <script src=原创 2018-04-30 22:08:10 · 285 阅读 · 0 评论 -
AngularJS 配置内置服务(config())
demo.html：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular原创 2018-05-01 12:24:30 · 4183 阅读 · 0 评论 -
AngularJS 配置过滤器服务($filterProvider),实现自定义过滤器的功能(config())
demo.html：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular原创 2018-05-01 12:51:57 · 1106 阅读 · 0 评论 -
AngularJS 运行块(run()),通过run()直接运行服务(模块)
运行块(直接运行,优先执行)：demo.html：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>AngularJS</title> <script sr原创 2018-05-01 13:05:31 · 1173 阅读 · 0 评论 -
AngularJS $rootScope根作用域,直接运行(run())(优先执行)
demo.html：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>AngularJS</title> <script src="angular原创 2018-05-01 13:22:41 · 1660 阅读 · 0 评论 -
AngularJS 单页面应用,路由(ngRoute),锚点传参($routeParams)
单页面应用(SPA)1、不产生页面跳转,提高用户体验。(链接使用锚点)2、把多个功能(视图)集成在一个页面中。根据不同的逻辑展示不同的视图(路由)(锚点)3、动态生成数据,通过Ajax异步获取。4、和Tab栏不同(SPA可以点击前进后退)5、外面包装一个壳(浏览器)模拟APP。6、AngularJS将监听锚点变化的事件(hashchange)进行封装,封装成前端路由(Route)。 不能使用锚点...原创 2018-05-01 19:06:54 · 705 阅读 · 0 评论 -
AngularJS angularJS实现了部分JQuery功能 (jqLite) (angular.element())
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS JQuery</title> <script src="jquery.min.js"原创 2018-05-01 20:31:16 · 483 阅读 · 0 评论 -
AngularJS 监听$scope中变量值的变化($watch())，脏检查
demo.html： Document {{name}} var App = angular.module('App',[]); App.controller("DemoController",['$scope',function($scope) { // $watch监听$sc原创 2018-05-08 20:34:37 · 8089 阅读 · 1 评论 -
AngularJS 通知angular(视图)进行数据更新($scope.$apply())
demo.html： Document {{time}} {{time2}} var App = angular.module('App',[]); App.controller("DemoController",['$scope','$interval',function($scope,$inte原创 2018-05-08 21:02:29 · 4133 阅读 · 0 评论 -
AngularJS 模块化,demo
AngularJS就是MVC模式的前端框架。demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>AngularJS</title></head><原创 2018-04-27 15:32:47 · 419 阅读 · 0 评论 -
AngularJS 控制器之间传递数据，事件($emit(),$broadcast(),$on())
demo.html：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body ng-app="App&q原创 2018-05-07 22:22:47 · 1165 阅读 · 0 评论