Angularjs
文章平均质量分 75
timelessmemoryli
多思考,思想很重要。
展开
-
深入理解 AngularJS 的 Scope
这篇文章很详细的描述了angular中的scope, 是我看到最全的了.一、遇到的问题问题发生在使用 AngularJS 嵌套 Controller 的时候。因为每个 Controller 都有它对应的 Scope(相当于作用域、控制范围),所以 Controller 的嵌套,也就意味着 Scope 的嵌套。这个时候如果两个 Scope 内都有同名的 Model 会发生什么呢?从子 Sco转载 2015-12-31 14:43:15 · 908 阅读 · 0 评论 -
AngularJS的启动引导过程
1.引导之前:库阶段在示例中,我们定义了一个指令ez-duang, 它应该会展开成一个动画 显示出来。AngularJS代码: angular.module("ezstuff",[]) .directive("ezDuang",function(){ return { restrict : "E",转载 2016-02-24 09:45:25 · 1599 阅读 · 0 评论 -
Angularjs自定义指令之三级联动---地理位置的选择
先上图代码 select { width : 116px; } .selectLocation select { display: block; float: left;原创 2016-02-23 16:10:27 · 4160 阅读 · 2 评论 -
angularjs拦截器实现loading
.mask-loading .loading-icon { -webkit-animation: rotate 1s linear infinite; -o-animation: rotate 1s linear infinite; animation: rotate 1s linear infinite;原创 2016-03-07 15:10:45 · 4165 阅读 · 0 评论 -
Angularjs自定义指令之面包屑
var myApp = angular.module('myApp', []); myApp.controller('Ctrl', function($scope){ $scope.crumbOptions = [ {"href": "http://www.baidu.com", "title" : "Home"}, {"原创 2016-02-18 15:54:03 · 3189 阅读 · 0 评论 -
angularjs自定义表单验证email
var myapp = angular.module("myapp", []); myapp.controller("MyController", ['$scope', function($scope) { $scope.email = ''; $scope.submitted = false;原创 2015-12-25 18:02:52 · 3110 阅读 · 0 评论 -
指令中访问ngModel的值
var myapp = angular.module("myapp", []); myapp.controller("MyController", ['$scope', function($scope) { $scope.content = "mario"; }]); myapp.dir原创 2015-12-25 13:00:05 · 1180 阅读 · 0 评论 -
angularjs中指令的scope
当angularjs指令创建时面临的一个问题就是作用域的创建,也就是指令的scope。angularjs提供了三种选择,体现在定义指令时的scope参数上,true,false,{}. 默认false;scope = false看代码原创 2015-12-24 18:41:54 · 1219 阅读 · 0 评论 -
Angularjs全局Modal
var app = angular.module("myapp", []); app.controller('globalController', ['$scope', 'idDeleteService', function($scope, idDeleteService) { $scope.transmitId = function(id) {原创 2016-01-08 15:34:42 · 1504 阅读 · 0 评论 -
Angularjs全局警告框
var myapp = angular.module('myapp', ['ngAnimate']); myapp.controller('msgController', ['$scope', 'notificationService', function($scope, notificationService) { $scope.msg = notif原创 2016-01-08 12:44:49 · 1089 阅读 · 0 评论 -
Angularjs多步表单
该小app设计到路由,动画index.html angular.module('formApp', ['ngAnimate', 'ui.router'])转载 2016-01-07 12:42:10 · 679 阅读 · 0 评论 -
Angularjs 页面切换动画(ui-view)
上一篇编辑不了,只能重开一篇。 var app = angular.module('myapp', ['ui.router', 'ngAnimate']); app原创 2016-01-07 11:31:14 · 8194 阅读 · 0 评论 -
Angularjs自定义指令之复制指令
var app = angular.module('myapp', []); app.directive('duplicate', function(){ return { transclude: 'element', replace: true,原创 2015-12-31 18:04:50 · 1006 阅读 · 0 评论 -
AngularJS的启动过程分析
AngularJS的启动过程分析本文例子所使用版本为 v1.3.9启动过程步骤1用自执行函数的形式让整个代码在加载完成之后立即执行inangular.js Line6(function(window, document, undefined)在window上暴露一个唯一的全局对象angular,Line250 /** @name angular转载 2016-02-24 10:27:33 · 499 阅读 · 0 评论 -
Angular路由2
URL参数基本参数通常,url动态部分被称为参数,有几个选项用于指定参数。基本参数如下:12345678910$stateProvider .state('contacts.detail', { // 这里设置了url参数 url: "/contacts/:contactId",原创 2016-01-05 14:10:21 · 1164 阅读 · 0 评论 -
记一个Angular的问题(ng-if,ng-show)
AngularJs button1 button2 var app = angular.module('app', []);app.controller('mainController', ['$scope', function($scope) { $scope.l原创 2016-12-20 15:58:34 · 4419 阅读 · 0 评论 -
Anguarjs实现国际化,中英文切换Demo
目录结构index.html Test Page {{lang}} {{'title' | translate}} {{'content' | translate: {whitespace: num} }}原创 2017-01-06 09:39:15 · 4032 阅读 · 0 评论 -
使用angularjs过程中遇到的bug
遇到一个bug,代码如下选项: 选项内容: 选择此选项是否让被调查者继续回答下一题: 此选项是否由被调查者自行输入: 是否跳题至Group1: 删除该选项原创 2016-12-05 09:13:25 · 1470 阅读 · 0 评论 -
基于Angularjs+mybatis的二级评论系统(仿简书)
一直想写个评论系统,看了下多说,网易的评论,想了下自己该实现怎样的评论系统。评论系统关键是嵌套层数以及数据库表设计。嵌套层数多,表结构复杂,呈现也麻烦,最后决定实现一个二级评论。系统由maven构建,springboot快速搭建spring环境。前台采用angularjs+bootstrap,后台使用springmvc+mybatis,数据库采用mysql.前台请求后台API操作评论。原创 2016-12-21 12:34:36 · 2034 阅读 · 5 评论 -
AngularJs在ng-click函数中如何获取代表当前元素的DOM对象
$scope.switchCheckBox = function($event, value) { // console.log(value) if (value) { $($event.target).addClass("checked"); } else { $($event.target).removeClass("chec原创 2016-11-25 16:16:58 · 39770 阅读 · 3 评论 -
关于angularjs+ueditor的一个bug
最近在写一个可配置,灵活度比较高的问卷调查系统,实现后台配置动态生成问卷,使用到了angularjs和百度的富文本编辑器ueditor,为了实现文本内内容的绑定在网上找了一段集成代码,其实就是一个指令。使用过程中发现了一个不容易发现的bug,就是在编辑器中插入图片之后不再进行其他内容的插入,此时图片地址是错误的。以下是修改以后的代码:angular-ueditor.js(functio原创 2016-12-03 10:51:36 · 3523 阅读 · 2 评论 -
angularjs折叠菜单
var expModule=angular.module('expanderModule',[]) expModule.directive('accordion', function() { return { restrict : 'EA', replac原创 2015-12-28 10:15:18 · 9247 阅读 · 0 评论 -
AngularJS: "Controller as" or "$scope"?
原文地址:http://codetunnel.io/angularjs-controller-as-or-scope/作者:Chev译者:timeless,转载请注明出处http://blog.csdn.net/u014788227 我才读完一篇由JonPapa写的博客,他谈论了使用 Controller as someName 替代在你的controlle翻译 2016-07-29 16:31:11 · 573 阅读 · 0 评论 -
毕设-婚恋网站-永恒网的设计与实现
最近就一直在忙着毕业设计,花了半个月写完了,大概介绍下:本系统名为永恒网,是基于Java和Angularjs的婚恋网站。项目由Maven构建,在技术上主要使用了Angularjs和SpringMVC技术。系统整体开发主要包括前台页面的Web设计与后台管理。开发工具包括Eclipse、Sublime、Google浏览器、Postman等。系统主要包括前台Web以及后台管理,前台实现的功能包括登录原创 2016-06-15 11:15:17 · 3781 阅读 · 12 评论 -
使用angularjs ui-bootstrap遇到的问题
今天在使用angulrjs的ui-bootstrap中的ui.bootstrap.pagination时遇到的问题。先来个示例代码:Page: {{bigCurrentPage}} / {{numPages}}一般controller中定义这几个变量$scope.maxSize = 4;$scope.bigCurrentPage = 4;$scope.big原创 2016-04-23 22:46:32 · 3675 阅读 · 0 评论 -
Angularjs 中遇到的一些问题
有时候在controller中直接定义一个类似$scope.name = '小明' 这样的变量,然后在view中引用 ng-model="name",然后你修改这个变量的值,也许会出现controller中变量的值不发生变化。而如果你把变量定义成$cope.vm = {name:'小明'} 则不会出现这样的问题。原因似乎是原型继承。 下面我摘取了一段跟这个问题类似的问题的解释,想要更为详细的知原创 2016-04-15 09:15:52 · 1016 阅读 · 0 评论 -
AngularJS 与 RequireJs 集成
目录结构各文件清单index.html AngularJs And RequireJs This is index.html go to ab state原创 2016-02-25 18:15:50 · 1939 阅读 · 0 评论 -
ngView页面切换动画(ng-view)
var app = angular.module('myapp', ['ngRoute', 'ngAnimate']); app.config(function($routeProvider) { $routeProvider // home page原创 2016-01-07 09:30:10 · 2796 阅读 · 0 评论 -
angularjs页面切换动画(ui-view)
var app = angular.module('myapp', ['ui.router', 'ngAnimate']); app.config(function($stateProvider) { $stateProvider // home page .st原创 2016-01-07 10:19:52 · 5130 阅读 · 1 评论 -
angularjs指令link函数参数scope,指令controller依赖注入的$scope,与指令外部controller的$scope的关系
还是看代码当指令中scope:false时 var app = angular.module('myapp', []); app.controller('myController', function($原创 2015-12-30 16:35:21 · 6249 阅读 · 0 评论 -
Angular中element具有的方法
在写指令时link函数中有一个element 参数,这里可以像操作jquery一样操作dom, 所以搜集了一下该element具有的方法addClass()-为每个匹配的元素添加指定的样式类名after()-在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点append()-在每个匹配元素里面的末尾处插入参数内容attr() - 获取匹配的元素集合中的第一个元素的属原创 2015-12-29 19:09:37 · 2630 阅读 · 0 评论 -
Understanding Angular’s $apply() and $digest() / 理解Angular中的$apply()以及$digest()
中文翻译转自:http://blog.csdn.net/dm_vincent/article/details/38705099原文转自:http://www.sitepoint.com/understanding-angulars-apply-digest/$apply() and $digest() are two core, and sometimes confusin转载 2015-12-29 13:51:31 · 699 阅读 · 0 评论 -
Angularjs中的注意点
angular.module('myapp', []) .directive('addBookBtn', function($compile) { return { restrict: 'EA', replace: true,原创 2015-12-29 11:29:12 · 508 阅读 · 0 评论 -
angularjs controller, service, directive 的demo
angular.module('myapp', []) .controller('BookController', ['$scope', 'AddBookService', function($scope, AddBookService) { $scope.books = AddBookService.books;原创 2015-12-29 10:56:06 · 678 阅读 · 0 评论 -
angularjs中的service
var myapp = angular.module('myapp', []); myapp.controller('myController', function($scope, myService) { $scope.send =function() { myService.getData()原创 2015-12-28 19:05:18 · 422 阅读 · 0 评论 -
angularjs的过滤器
Angularjs内置的过滤器在html中调用,使用 |一个过滤器,不带参数的情况{{expression | filter}}一个过滤器,带参数的情况{{expression | filter:arguments}}一个过滤器,带多个参数的情况{{expression | filter: arg1: arg2: ...}}多原创 2015-12-28 17:20:37 · 454 阅读 · 0 评论 -
angularjsjs require : 'ngModel'
var myapp = angular.module("myapp", []); myapp.controller("MyController", ['$scope', function($scope) { $scope.name = "mario"; $scope.age = "13";原创 2015-12-28 09:53:23 · 1557 阅读 · 0 评论 -
controller 间共享数据
body { padding-top:30px; } angular.module('myapp', []) .factory("Data", function() { return { msg:"hello worl原创 2015-10-22 17:10:11 · 488 阅读 · 0 评论 -
AngularJs 失去焦点事件
body { padding-top:30px; } var app = angular.module('app', []); app.controller('Ctrl', function ($scope) { //array of edited f原创 2015-10-21 16:27:16 · 28104 阅读 · 0 评论 -
Angularjs自定义表单验证
自定义表单验证指令要用到这几个知识点:$parsers,下面是对这个的解释:当用户同控制器进行交互,并且ngModelController中的$setViewValue()方法被调用时, $parsers数组中的函数会以流水线的形式被逐个调用。第一个$parse被调用后,执行结果会传 递给第二个$parse,以此类推。这些函数可以对输入值进行转换,或者通过$setValidity()函数设转载 2015-10-22 10:23:01 · 1772 阅读 · 0 评论