在讲正题之前，先说一下有关angular简介方面的信息： 1. angularJS 诞生于2009年，由Misko Hevery 等人创建，后为Google所收购。是一款优秀的前端JS框架，已经被用于Google的多款产品当中。AngularJS有着诸多特性，最为核心的是：MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等等。 2. AngularJS 是一个 JavaScript 框架。它可通过 <script> 标签添加到 HTML 页面。 3. AngularJS 通过 指令 扩展了 HTML，且通过 表达式...
AngularJS 1.5.0-beta.2With AngularJS 1.5.0-beta.2, we’ve improved the performance and flexibility of Angular 1 while still maintaining reliability and functionality for existing applications. This version contains numerous weeks worth of fixes, documentation upgrades and performance improvements. 1.5.0-beta.2 also introduces a number of new features which should give a strong motivation for you t...
ngPluralize is a directive that displays messages according to en-US localization rules. <script>angular.module(‘pluralizeExample‘, []).controller(‘ExampleController‘, [‘$scope‘, function($scope) {$scope.person1 = ‘Igor‘;$scope.person2 = ‘Misko‘;$scope.personCount = 1;}]); </script> <div ng-controller="ExampleController"><label>Person 1:<input type="text" ng-model="person1" value="Igor"...
AngularJS: Factory vs Service vs ProviderBy Tyler On May 4, 2014 With 44 Comments In TechnicalWhen you first get started with Angular, you’ll naturally find yourself flooding your controllers and scopes with unnecessary logic. It’s important to realize early on that your controller should be very thin; meaning, most of the business logic and persistent data in your application should be taken...
最近在搞AngularJs,需要实现一个自动检索的效果。因初次接触AngularJs大费周折，百度了N多种方法.代码从几十行到几百行的都有，杂乱不堪。最后发现其实简简单单的一句代码就可以很棒的实现这个效果，为了避免有太多的人跟我入一样的坑。分享在这里，哪里有什么不好的，欢迎大家留言。代码如下<script src="js/angular.js"></script><div ng-app="test"><div ng-controller="testController"><div class="user_inleft"><input type=...
ng-disable指令的应用：<button ng-disabled="mySwitch">click me</button> <input type="checkbox" ng-model="mySwitch"> {{ mySwitch}} </div> ng-show指令的应用：<div ng-app="myApp"><div ng-show="true">可见</div><div ng-show="false">不可见</div> </div><div ng-app="myApp" ng-init="hour=14"><div ng-show="hour>12">可见</div> </div> ng-hide指令的应用：<div ng-app="myApp"><div ng-hide="true">不可见</div><div ...
本插件的开发目的主要给前端同学使用，本人是专注于后台开发的，对css样式不熟悉，但逼于前端要求做一个共公组件方便日常开发，所以这个插件在样式上可能不适合大部分人，喜欢的拿走吧，不喜欢的也请别喷。 一、使用环境 1.Angularjs 1.x 2.Bootstrap 3 在自己的环境里请自行配置js和css，本文不作这方面的介绍。二、效果图 效果逻辑： 1.当前页码默认选中高亮状态 2.页码少于等于1，则“上一页”为不可...
app.filter("dateFliter", function () {return function (input) {//获取过滤器中所有的参数，原始参数是默认排在数组第一位var args = Array.prototype.slice.call(arguments);if (input == null || input == "") {input = new Date().getTime();}else {input = new Date(Date.parse(input.replace(/-/g, "/"))).getTime();}//分钟var dates = parseInt((input - new Date().getTime())) / (1000 * 60);//小时var h = dates / (6...
目录序言遗留项目概述条件限制下的升级原则升级改造的演进方向遇到的主要难点小结参考1. 序言Angular 官方网站针对 从 AngularJS 升级到 Angular 提供了比较详细的文档，并给出了一个 PhoneCat 升级教程 的案例演示，指导一步步如何改造。但总的来说，这个案例还是太过简单，并不能很好地还原一个最原始的、相对复杂的、版本更低的遗留项目该如何一步步升级，以及升级过程中可能需要考虑的一些额外因素。本篇文章会以一个相对复杂的...
<!DOCTYPE html> <html> <body><div ng-app="" ng-init="firstName='John'"><p>姓名为 <span ng-bind="firstName"></span></p></div><script src="angular-1.0.1.min.js"></script></body> </html>angular-1.0.1.min.js的下载地址：http://download.csdn.net/detail/zl544434558/8015741原文：http://blog.csdn.net/zl544434558/article/details/39928251
最近工作需要用到,接触的比较多，在此系统学习一下。 angular.js 是新一代web MVC开发框架,对应 模型,视图,控制器.,相比 jquery 模式,这种新玩意竟然不需要开发者直接去操作dom .angular.js的优点:1.数据双向绑定,视图与模型保持一致性，视图的改变可以同步到模型,模型的改变也可以体现在视图上.2.依赖注入,起初学习,这点不是特别好理解,比如一个视图对应一个控制器,我们知道逻辑部分要写到控制器里面,加入A,B视图都有共用 的...
一. 单向绑定（ng-bind）和双向绑定（ng-model）的区别：1.ng-bind 单向数据绑定（$scope->view），用于数据显示，简写形式，{{}}。<span ng-bind="val"></span><span>{{val}}</span>而这两者的区别，在于页面没有加载完毕时，{{val}}会直接显示到页面，直到angular渲染该绑定数据，这种写法可能将{{val}}让用户看到；而ng-bind则在angular渲染完毕后将数据显示。2.ng-model是双向数据绑定（$scope->view , view->$scope），用于绑...
1、<label class="col-md-7 col-sm-7 control-label">公积金管理部名称:</label> <div class="col-md-3 col-sm-3 form-inline"> <input type="text" class="form-control" id="fundName_search" ng-model="transactionsFund.fundname" data- provide="typeahead" placeholder="部门姓名"> <button type="button" class="btn btn-primary" ng-click="quer...
When you have a checkbox, not necessary that just ‘ture‘ & ‘false‘, you might have ‘yes‘, ‘no‘, ‘1‘, ‘0‘:There is how to use ng-true-value and ng-false-value with ng-checked for checkbox:<input type="checkbox" ng-model="checkbox" ng-true-value="1" ng-false-value="0" ng-checked="checkbox == 1"/>$scope.$watch(function(){return $scope.checkbox; }, function(){$scope.checkbox = Number($scop...
1<!DOCTYPE html> 2<html > 3<head> 4<meta charset="utf-8"> 5<title></title> 6<script src="angular.min.js"></script><!--引入angularjs--> 7</head> 8<body ng-app ng-init="a=3;b=5;"> <!--设置初始ng-init的初始值 --> 910<h1>{{a}}</h1> <!--这里会显示为3-->1112<h1 ng-bind="b"></h1> <!-- 这里会显示为5-->1314<h1 ng-bind="b*a"></h1> <!--这里为15即 5*3-->1516<h1 ng-bind="b>a"></h1> <!--这里...