AngularJs
fishermanmax
这个作者很懒,什么都没留下…
展开
-
指令
指令初体验 四种匹配模式: E 元素 A(default) 属性 C 样式 M 注释 指令运行三阶段: 加载阶段:找到ng-app指令,确定应用边界 编译阶段:遍历DOM,根据指令template、replace、transclue转换DOM,运行compile函数 链接阶段:运行Link,操作DOM、绑定事件监听器 模板的重用: 使用缓存: var myM原创 2016-08-03 14:48:50 · 313 阅读 · 0 评论 -
angularjs ui-router 动态切换视图到指定的ui-view中
任何 SPA 框架的路由系统都是一样的:每一个路由对应着应用程序的状态,而应用程序状态的变化体现在 URLs 的变化上;反之也是,URLs 的变化将会引起路由系统动态的刷新应用程序的状态。 在你的例子,路由的入口只有恒定的一个 ui-view='content',但却要不同的视图(c.html 和 d.html)动态的进入其中,这就意味着 c.html 和 d.html 要对应应用程序的不同转载 2016-08-13 16:29:11 · 1435 阅读 · 0 评论 -
密码和确认密码一致的Angularjs验证
type='password' id='pw1' name='pw1' ng-model='pw1' ng-required/> type='password' id='pw2' name='pw2' ng-model='pw2' ng-required pw-check='pw1'/> 指令定义部分: angular.module('myApp.directives', [])转载 2016-09-04 16:09:12 · 3814 阅读 · 3 评论 -
angularjs显示html文本
Angularjs中输出变量使用“{{}}”或者“ng-bind”,但是如果变量中有html代码的话,angularjs为了xss安全,默认是不解析html,直接原样显示html代码。 如果需要显示解析后的html代码,需要使用angular-sanitize模块。 控制器代码 demo.controller('Demo13Controller', [ '$scope', funct转载 2016-08-23 16:56:02 · 4929 阅读 · 0 评论 -
Service与Provider
类似于Jq的AJAX功能: var myModule=angular.module("MyModule",[]); myModule.controller('LoadDataCtrl', ['$scope','$http', function($scope,$http){ $http({ method: 'GET', url: 'data.json' }原创 2016-08-06 19:21:46 · 623 阅读 · 0 评论 -
一招制敌 - 玩转 AngularJS 指令的 Scope (作用域)
学习了AngularJS好长时间,最近再次回首看看指令这部分的时候,觉得比自己刚开始学习的时候理解的更加深入了,尤其是指令的作用域这部分。 当初看的是《AngularJS权威指南》这本书,但是感觉这本书关于这方面讲的不是很细致, 另外吐槽一下,这本书中文版印刷的质量不是很好,很多地方都有错误;不过讲的还是可以的,是一本学习AngularJS的好书。 下面我们就来详细分析一下指令的作用转载 2016-08-28 00:30:23 · 857 阅读 · 0 评论 -
路由相关
前端路由基本原理: 可以通过哈希# 使用HTML5中的新history API 定义状态 会"优雅降级"原创 2016-08-02 11:07:57 · 216 阅读 · 0 评论 -
双向数据绑定
使用,World!取代原来是{{}}可绑定数据,刷新看不到过程。 简单数据的填充绑定: var userInfoModule = angular.module('userInfoModule',[]); userInfoModule.controller('UserInfoCtrl',['$scope',function($scope){ $scope.userInfo = { em原创 2016-08-01 23:18:09 · 413 阅读 · 0 评论 -
AngularJs的路由、模块化与依赖注入
简单模块的建立: js; var helloModule = angular.module('HelloAngular',[]); helloModule.controller('helloNgCtrl',['$scope',function($scope){ $scope.greeting = { text:'Hello' }; }]); html: module原创 2016-08-01 20:26:13 · 542 阅读 · 0 评论 -
前端的MVC
为实现模块化和复用! 最简单的控制器: view: ag_test {{ greeting.text }},Angular test1 {{ greeting.text }},Angular test2 通用 Controller: function CommonController($scope){ $s原创 2016-08-01 00:27:27 · 288 阅读 · 0 评论 -
AngularJs专用测试工具Protractor 搭建PhoneCat项目的开发与测试环境
它基于WebDriverJs AngularJS官方网站提供了一个用于学习的示例项目:PhoneCat。这是一个Web应用,用户可以浏览一些Android手机,了解它们的详细信息,并进行搜索和排序操作。 对于PhoneCat项目的开发环境和测试环境的搭建,官方网站上提供了详细的指导:http://docs.angularjs.org/tutorial 。 获取源代码转载 2016-07-31 22:31:00 · 919 阅读 · 0 评论 -
Karma和Jasmine自动化单元测试
arma和Jasmine自动化单元测试 从零开始nodejs系列文章,将介绍如何利Javascript做为服务端脚本,通过Nodejs框架web开发。Nodejs框架是基于V8的引擎,是目前速度最快的Javascript引擎。chrome浏览器就基于V8,同时打开20-30个网页都很流畅。Nodejs标准的web开发框架Express,可以帮助我们迅速建立web站点,比起PHP的开发效率更高转载 2016-07-31 21:59:24 · 698 阅读 · 0 评论 -
Angularjs grunt开发相关的有关工具
Nodejs 需要使用npm包 npm install grunt 代码处理工具 bower 依赖管理工具 bower install http-server 在任何地方都可以用浏览器访问 karma 单元测试runner jasmine 单元测试工具 分组:describe(string,function) 一组测试用例 测试用例 it(string,function) 测试用原创 2016-07-31 21:57:46 · 211 阅读 · 0 评论 -
Grunt环境搭建和简单压缩尝试
当然了,得先安装Nodejs的NPM管理 1、目的 将node-webkit 进行打包成app操作 2、步骤 从 nodejs官网 下载安装包安装,windows是傻瓜式的,安装好之后应该是有 npm (nodeJs package manage)nodejs包管理工具 的,dos命令检查自己是否安装成功。 node -v //显示node版本 npm -v //显示npm包管理工转载 2016-07-31 02:15:33 · 261 阅读 · 0 评论 -
AngularJS封装指令实现下拉刷新自动翻页加载数据
目前PC的网页越来越流行瀑布流的下拉刷新自动加载数据,本文来讲解一下。 滚动翻页基本原理就是判断scrollTop和offsetHeight之和 大于等于 scrollHeight。 一、不适用Jquery,单纯使用AngularJS实现 1、定义模块、指令、控制器 scroll.js代码如下: // 定义模块 var scroll = angular.module('s转载 2016-08-25 17:17:18 · 8481 阅读 · 1 评论