前段时间一直在看AngularJS的资料，感觉是个很好的框架，很想有机会尝试用它做点什么。 jQuery ZTree是国内非常不错的JQuery插件，功能齐全，文档和API也非常的友好，之前项目上常用此插件。 AngularJS 功能虽然非常强大，但UI上提供的插件不像JQuery那么多，而且只能通过directive定义扩展的UI插件，虽然国外已经提供了一些基于 directive的Tree功能实现，但毕竟不像ZTree那样强大，而且Tree是做项目中很长用的一个基本功能。 因此...
指令（Directives）是所有AngularJS应用最重要的部分。尽管AngularJS已经提供了非常丰富的指令，但还是经常需要创建应用特定的指令。这篇教程会为你讲述如何自定义指令，以及介绍如何在实际项目中使用。在这篇文章的最后（第二部分），我会指导你如何使用Angular指令来创建一个简单的记事本应用。 概述 一个指令用来引入新的HTML语法。指令是DOM元素上的标记，使元素拥有特定的行为。举例来说，静态的HTML不知道如何来创建和展现一...
权限的设计中比较常见的就是RBAC基于角色的访问控制,基本思想是，对系统操作的各种权限不是直接授予具体的用户，而是在用户集合与权限集合之间建立一个角色集合。每一种角色对应一组相应的权限。一旦用户被分配了适当的角色后，该用户就拥有此角色的所有操作权限。这样做的好处是，不必在每次创建用户时都进行分配权限的操作，只要分配用户相应的角色即可，而且角色的权限变更比用户的权限变更要少得多，这样将简化用户的权限管理，...
angular是Google开发的一个单页面应用框架,是现在比较主流的单页面应用框架之一.该强大的地方有很多,比如双向数据绑定,应用了后端的MVC模式到前端,自定义指令等.既然是单页面应用,肯定离不开页面的切换.我们首先来说一下angular的路由.angular实现页面切换时用了route. <script src="js/plugins/angular/angular.min.js"></script> <script src="js/plugins/ui-router/angular-ui-router.min.js"></script> angular.min.js要在angu...
AngularJS是一款非常强大的前端MVC框架,AngularJS中的controller是个函数，用来向视图的作用域（$scope）添加额外的功能，我们用它来给作用域对象设置初始状态，并添加自定义行为。 当我们在创建新的控制器时，angularJS会帮我们生成并传递一个新的$scope对象给这个controller,在angularJS应用的中的任何一个部分，都有父级作用域的存在，顶级就是ng-app所在的层级，它的父级作用域就是$rootScope。 每个$scope的$root指向$rootSco...
在AngularJS中，有时候需要监视Scope中的某个变量，因为变量的改变会影响一些界面元素的显示。有时，也希望通过jQuery调用Scope的某个方法。 比如以下场景：<div> <button id="jQBtn">jQ Button</button> </div> <div id="ngSection" ng-controller="NGCtrl"> <input type="checkbox" ng-model="jQBtnState"/> Toggle jQ button state <p>Counter: {{counter}}</p> </div> 以上，我们希望： ● Scope中的jQBtnState变量值如果为fal...
在我们平常的开发中，有时候会需要获取一下check框选中的值，以及check框选中行的所有信息。这个时候有一个小技巧那就是我们可以把要获取的信息全部放到check框的值里面，这样我们可以获取check框选中值的时候也就相当于获取了当前行的信息。代码如下: <td><input class="states" type="checkbox" name="orders" value="{{e.merchantId}},{{e.orderCode}},{{e.userId}}"/></td> 全选全不选： var bischecked=$(#cboxchecked).is...
写此文的背景：在学习使用angular的$http.post()提交数据时，后台接收不到参数值，于是查阅了相关资料，寻找解决办法。 写此文的目的：通过上面提到的文章中的解决之道，结合自己的经验，总结了如下发现。 前端：html，jquery，angular 后端：java，springmvc 一、平常使用的post提交和接收方式 前端使用jquery提交数据。$.ajax({url:/carlt/loginForm,method: POST, data:{"name":"jquery","password":"pwd"},dataType:json,succ...
这是我后台SpringMVC控制器接收isform参数的方法，只是简单的打出它的值： @RequestMapping(method = RequestMethod.POST)@ResponseBodypublic Map<String, Object> save(@RequestParam(value = "isform", required = false) String isform) {System.out.println("isform value: " + isform);return null;} 前台页面发送一个post提交表单的请求发现后台没有取到值后边我想到的第一种方案是在控制器方法参数里加requestbody来接收js...
AngularJS是什么？AngularJs（后面就简称ng了）是一个用于设计动态web应用的结构框架。首先，它是一个框架，不是类库，是像EXT一样提供一整套方案用于设计web应用。它不仅仅是一个javascript框架，因为它的核心其实是对HTML标签的增强。 何为HTML标签增强？其实就是使你能够用标签完成一部分页面逻辑，具体方式就是通过自定义标签、自定义属性等，这些HTML原生没有的标签/属性在ng中有一个名字：指令（directive）。后面会详细介绍...
Angular.js 中的特性,双向绑定.多么神奇的功能,让视图的改变直接反应到数据中,数据的改变又实时的通知到视图,如何做到的? 这要归功于 scope 下面3个重要的方法: $watch $digest $apply他们的区别是什么,我们来介绍下: $watch 这是一个监听 scope 上数据的监听器 方法说明: $scope.$watch(参数,function(newValue,oldValue){//逻辑处理 }) 上面我们就是创建了一个监听器. ‘参数 就是$scope对象下的一个对象(或者一个对象的属性),注...
本文展示了AngularJS框架实现的hello world代码示例. 如下是一些你在看Hello World 示例和接下来的代码示例时需要重点关注的方面. ng-app, ng-controller, ng-model 指令 带有两个大括弧的模板步骤 1: 在<Head>部分包含Angular Javascript 将下面的代码包含入 <head></head> 中，以引入 Angularjs javascript 文件. 可以用如下写法从 Google 管理的库 获得最新的代码. <script src="//ajax.googleapis.com/ajax/libs/angul...
开发者们都一致认为单元测试在开发项目中十分有好处。它们帮助你保证代码的质量，从而确保更稳定的研发，即使需要重构时也更有信心。 测试驱动开发流程图 AngularJS的代码声称其较高的可测性确实是合理的。单单文档中列出端对端的测试实例就能说明。就像AngularJS这样的项目虽然都说单元测试很简单但真正做好却不容易。即使官方文档中以提供了详尽的实例，但在我的实际应用中却还是很有挑战。这里我就简单示范一下我是怎么操作的吧...
AngularJS对表单的处理相当简单。在AngularJS使用双向数据绑定方式进行表单验证的时候，实质上它在帮我们进行表单处理。 使用复选框的的例子有很多，同时我们对它们的处理方式也有很多。这篇文章中我们将看一看把复选框和单选按钮同数据变量绑定的方法和我们对它的处理办法。 创建Angular表单 在这篇文章里，我们需要两个文件:index.html和app.js。app.js用来保存所有的Angular代码（它不大），而index.html是动作运行的地方。首先...
AngularJS 提供了一个很棒的方式来创建单页app。正是由于这个原因，使得我们的站点看起来更像是一个原生的手机程序。为了使它看起来更像是原生的程序，我们可以使用 ngAnimate module 为它添加过渡和动画效果。 这个模块可以使我们创建漂亮的程序。今天，我们将要看一下如何为 ng-view 添加动画效果。 我们要构建什么 我们假设我们有一个单页面的程序，并且想为这个页面添加动画效果。点击某一个链接会将一个试图滑出，同时将另一个...