angularjs
关注
分享
扫一扫
wust小吴
爱学习 活泼 开朗
展开
-
angularJS学习之路（十一）---ng-show和ng-hide
ng-show 和 ng-hide 根据表达式的值来显示或者隐藏HTML元素ng-show false 被隐藏ng-hide true 被隐藏 2 + 2 isn't 5, don't show 2 + 2 is 4, do show 2 + 2 isnt 5, don't hide 2 + 2 isnt 5,原创 2015-11-23 13:38:59 · 640 阅读 · 0 评论 -
angularJS学习之路（十八）---自定义指令执行过程
angularJS中对指令的解析与执行过程是这样的：· 浏览器得到 HTML 字符串内容，解析得到 DOM 结构。· ng 引入，把 DOM 结构扔给 $compile 函数处理：o 找出 DOM 结构中有 变量占位符o 匹配找出 DOM 中包含的所有指令引用o 把指令关联到 DOMo 关联到 DOM 的多个指原创 2015-11-23 21:45:55 · 733 阅读 · 0 评论 -
angularJS学习之路（十九）---自定义指令关于独立作用域
1.首先关于 scope：{} 和scope：true 效果是一样的 Surrounding scope: {{ myProperty }} Inside an directive with inherited scope: {{ myProperty }} Inside myDirective, isolate原创 2015-11-23 22:52:24 · 930 阅读 · 0 评论 -
angularJS学习之路（二十）---自定义指令作用域绑定策略问题
自定义标签或者进行扩展时，会有这样的需求场景，要在标签中添加一些属性，实现一些复杂功能。 关于这些属性，独立作用域是如何的做的呢？看看下面的内容吧。 举个例子： 假设传入的是上面这种，我们如何区分它传入的到底是变量呢？还是字符串呢？还是方法呢？ 因此AngularJS有了三种自定义的作用域绑定方式： 1 基于字符串的绑定：使用@操作符转载 2015-11-23 23:00:48 · 896 阅读 · 0 评论 -
angularJS学习之路（二十）---自定义指令---transclude的作用
js代码：var app = angular.module("myApp", []);app.directive("clock", function() { return { restrict: 'E', scope: { timezone: "@" }, template: "12:00pm {{timezone}}" }});app.directive("原创 2015-11-24 10:19:20 · 634 阅读 · 0 评论 -
angularJS学习之路（二十二）---模块加载---config
angularJS 模块可以在被加载和执行之前对其自身进行配置 作用就是：在应用的加载阶段应用不同的逻辑我们知道 前面注册一个模块方法是：var app = angular.module("myApp", []); 这种方法带有两个参数，一个是模板名，一个是依赖注入列表，数组为空，表示当前注册的模板不需要依赖关系这种方法注册的模板，angularJS机制会原创 2015-11-24 13:05:28 · 17086 阅读 · 1 评论 -
angularJS学习之路（二十五）---创建服务的五大方法---provider
所有的服务工厂都是由 $provider 服务创建的，$provider服务负责在运行时初始化这些提供者所有的创建服务的方法都是构建在provider方法之上的，provider方法负责在$providerCache中注册服务下面两种方法是等价的：这里我们假设了提供者是一个具有$get方法的对象app.factory('game', function()原创 2015-11-24 16:55:01 · 902 阅读 · 0 评论 -
angularJS学习之路（十五）---ng-select
作用就是构建 动态表单和它ng-options一起使用 Choose City Best City: {{ city.name }} var app = angular.module('myApp', []); app.controller('CityControl原创 2015-11-23 16:50:41 · 630 阅读 · 0 评论 -
angularJS学习之路（二十一）---injector---初探依赖注入
首先看看injector 怎么用 js代码：var app = angular.module("myApp",[]);app.factory("game",function(){ return { title:"StarCraft" }});//创建一个injector 参数为绑定的模板 会返回一个injector对象//通过返回的对象你可以调用模板里面的各种服务an原创 2015-11-24 12:25:54 · 1039 阅读 · 0 评论 -
angularJS学习之路（三十）---自定义指令---templateUrl
第一种写法： {{title}} the content is :{{model.content}} 第二种写法是把html放在单独的html文件里面： {{title}} var app = angular.原创 2015-11-25 09:39:14 · 5771 阅读 · 0 评论 -
angularJS学习之路（二十七）---创建服务的五大方法---value
如果服务的$get()方法返回的是一个常量那就没有必要定义一个包含复杂功能的完整服务可以通过value（）函数方便的注册服务value方法接受两个参数：name 字符串：需要注册的服务的名字value 值，常量：将这个值作为可以注入的实例返回value（）方法：返回以name参数的值 为名称 的注册后的服务实例ang原创 2015-11-24 18:53:09 · 889 阅读 · 0 评论 -
angularJS学习之路（二十八）---拦截服务
$provider 服务提供了在服务实例创建时对其进行拦截的功能拦截的目的就是对服务就行 扩展（修改） 或者 用另外的内容进行替代装饰器的功能是非常强大的，它不仅可以在应用在我们自己的服务上，也可以对angularJS的核心服务进行拦截、中断、甚至替换功能的操作事实上angularJS中很多功能的测试就是借助 $provider.decorat原创 2015-11-24 19:44:25 · 709 阅读 · 0 评论 -
angularJS学习之路（三十）---服务器通信（1）---基本概念
使用$http 服务直接同外部对象进行通信$http服务只是简单的封装了浏览器 原生的 XMLHttpRequest对象$http服务只能接受一个参数，这个参数必须是一个对象，配置内容返回值是一个 promise 对象，具有success方法和error方法基本使用场景：$http({ method:'GET', url:'/api/u原创 2015-11-25 11:14:22 · 609 阅读 · 0 评论 -
angularJS学习之路（二十六）---创建服务的五大方法---constant
这个方法 可以将一个已经存在的 变量值 注册为服务 变成一个常量 特别注意 ：说的是变量值 变成了 常量并将其注入到 应用的其他部分当中，然后用常量将其保存下来这个函数接受两个参数：name 字符串：需要注册的服务的名字 value 常量：需要注册的常量的值 或者 对象constant方法返回一个注册后的服务实例原创 2015-11-24 18:30:53 · 667 阅读 · 0 评论 -
angularJS学习之路（十六）---ng-class
作用：动态设置元素的类 5}" ng-if="x > 5"> You won! Draw Number Number is: {{ x }} var app = angular.module('myApp', []); app.controller('LotteryContr原创 2015-11-23 16:59:49 · 659 阅读 · 0 评论 -
angularJS学习之路（二十三）---创建服务的五大方法---factory
factory（）方法：是创建 和配置服务的最 快捷的方式factory（）函数可以接受两个参数：name 字符串 ：需要注册的服务名函数function：函数会在angularJS创建服务的实例时被调用，返回对象angular机制出于内存占用和性能的考虑，控制器只会在需要的时候被 实例化，不需要的时候就会被销毁服务需原创 2015-11-24 15:43:39 · 1295 阅读 · 1 评论 -
angularJS学习之路（十七）---自定义指令
指令简单理解 就是 在元素上运行的函数 （这个函数有个名称，或者叫属性，比如id 等这种形式）或者说 扩展这个元素的功能 原来的HTML 元素 比如 input 就只是一个输入框 如果我们在这个元素上加入 指令，就可以扩展这个元素的功能了比如说：ng-click 可以让一个元素能够监听click事件，并在接收到事件的时候执行angularJS原创 2015-11-23 21:39:06 · 738 阅读 · 1 评论 -
angularJS学习之路（十二）---｛｛｝｝发生屏幕闪烁问题
在屏幕可视的区域内使用 ｛｛｝｝会导致页面加载时未渲染的元素发生闪烁，用ng-bind 可以避免这个问题解决办法二：使用 ng-cloak 指令 来避免 FOUC ng-bind-template 用来在视图中绑定多个表达式原创 2015-11-23 14:04:28 · 966 阅读 · 0 评论 -
angularJS学习之路（四）---作用域（1）
这里提到的“作用域”的概念，是一个在范围上与 DOM 结构一致，数据上相对于某个 $scope 对象的属性的概念。我们还是从 HTML 代码上来入手： <div style="width: 100px; height: 100px; background-color: red;" ng-click="click()"> {{ w }}原创 2015-11-22 20:51:17 · 664 阅读 · 0 评论 -
angularJS学习之路（一）---开始入门
在输入框中输入： 姓名： {{name}}原创 2015-11-22 16:23:48 · 930 阅读 · 0 评论 -
angularJS学习之路（三）---控制器
AngularJS 控制器 控制 AngularJS 应用程序的数据。AngularJS 应用程序被控制器控制。ng-controller 指令定义了应用程序控制器。控制器是 JavaScript 对象，由标准的 JavaScript 对象的构造函数 创建。 名: 姓:原创 2015-11-22 19:43:55 · 722 阅读 · 0 评论 -
angularJS学习之路（五）---表达式
AngularJS 表达式写在双大括号内：{{ expression }}。AngularJS 表达式把数据绑定到 HTML，这与 ng-bind 指令有异曲同工之妙。AngularJS 将在表达式书写的位置"输出"数据。AngularJS 表达式 很像 JavaScript 表达式：它们可以包含文字、运算符和变量。AngularJS 表达式不支持条件判断，循环及异原创 2015-11-22 21:37:26 · 723 阅读 · 0 评论 -
angularJS学习之路（六）---指令
AngularJS 指令AngularJS 指令是扩展的 HTML 属性，带有前缀 ng-。 一开始需要知道的几个指令：ng-app 指令初始化一个 AngularJS 应用程序。ng-init 指令初始化应用程序数据。ng-model 指令把元素值（比如输入域的值）绑定到应用程序。ng-repeat 指令会重复一个 HTML 元素：原创 2015-11-22 22:47:57 · 660 阅读 · 0 评论 -
angularJS学习之路（九）---ng-if
ng-if 指令可以根据表示的结果 在DOM中生成或者移除一个元素 而且是完全移除 不是隐藏或者显示而且需要注意的是：当重新被插入的时候，元素的状态是 原始状态 而不是上次移除时的状态 Won't see this DOM node, not even in the source code H原创 2015-11-23 13:26:20 · 688 阅读 · 0 评论 -
angularJS学习之路（七）---子控制器关于是引用机制还是复制机制的问题---原型继承
我们知道在一个应用中可以有 多个控制器，也即是控制器的嵌套 原型继承 要弄清一点： 修改父级对象中的alue值会同时修改 子对象中的alue值，但是反过来就不行了，angularJS 中的控制器 嵌套 采用的就是 原型继承的 机制ps：javascript 对象要么是值复制 要么是 引用复制首先看第一个例子：js代码：va原创 2015-11-23 10:18:16 · 851 阅读 · 0 评论 -
angularJS学习之路（八）---ng-switch
这个指令 和 ng-switch-when 以及 on="name"一起使用 在name值发生变化时渲染不同的指令到视图中 例子： And the winner is {{ person.name }} var app = angular.module('myA原创 2015-11-23 13:13:47 · 821 阅读 · 0 评论 -
angularJS学习之路（十三）---ng-change
在表单输入发生变化时调用： {{ equation.output }} var app = angular.module('myApp', []); app.controller('EquationController', function($scope) { $scope.equation = {原创 2015-11-23 14:30:45 · 823 阅读 · 0 评论 -
angularJS学习之路（二）---模块
模块定义了一个应用程序。模块是应用程序中不同部分的容器。模块是应用控制器的容器。控制器通常属于一个模块。 {{ firstName + " " + lastName }} /*定义一个应用，也就是一个模块 参数：名称 ，依赖*/ /*在模块定义中 [] 参数用于定义模块的依赖关系原创 2015-11-22 19:23:17 · 817 阅读 · 0 评论 -
angularJS学习之路（十四）---ng-form
The field is required. Submit All var app = angular.module('myApp', []); app.controller('FormController', function($scope) { $scope.fields = [{ placeholder: 'Usern原创 2015-11-23 16:44:45 · 700 阅读 · 0 评论 -
angularJS学习之路（二十四）---创建服务的五大方法---service
service（）这个方法，可以允许我们为服务对象注册一个构造函数接受两个参数：name 字符串，要注册的服务的名称constructor()函数：构造函数，我们调用它来实例化服务对象service（）函数会在创建实例时通过 new关键字来实例化服务对象举个例子，var Person = function($http){原创 2015-11-24 16:06:55 · 944 阅读 · 0 评论 -
angularJS学习之路（二十九）---控制器的别名使用 和它的作用域的确定
Open var app = angular.module('myApp',[]); app.controller("RoomController",function () { this.openDoor = function () { alert("open the door !"); } });原创 2015-11-24 22:28:42 · 1533 阅读 · 0 评论