【this详解】1、谁最终调用函数，this指向谁。 ① this指向的，永远只可能是对象！！！！！！ ② this指向谁，永远不取决于this写在哪！！而是取决于函数在哪调用。 ③ this指向的对象，我们称之为函数的上下文context，也叫函数的调用者 2、※※※※※this指向的规律(与函数调用的方式息息相关)：this指向的情况，取决于函数调用的方式有哪些： ① 通过函数名()直接调用：this指向window ② 通过对象.函...
在指令而非在控制器中操作DOM 相信大家在页面处理中，难免会遇到操作DOM的情况，在AngularJS中，对DOM的操作是在指令而非控制器中完成的。 AngularJS强调隔离的思想：把复杂的逻辑和操作放在指令或服务中，控制器作为视图和$scope之间的桥梁，仅仅用来存储数据模型。 jqLite 为了便于DOM操作，AngularJS内部封装了angular.element，如果现有项目中已经引入的jQuery，angular.element相当于jQuery函数的别名，否则，angular.element...
本文主要给大家介绍了Angular.Js过滤器filter与自定义过滤器filter的相关内容，分享出来供大家参考学习，下面来看看详细的介绍： 一、AngularJS的filter过滤器：uppercase|lowercase:大小写转换过滤json:json格式过滤date:日期格式过滤number:数字格式过滤currency:货币格式过滤filter:查找limitTo：字符串对象截取orderBy:对象排序<!DOCTYPE html> <html lang="zh_CN"> <head> <meta charset="UTF-8"> <title>Angular基础</titl...
前言 算了算用angualrjs去做开发也有两个月了，但做为一个菜鸟，难免会被大神吊打(这里有一个悲伤的故事...)。某天一位前端大神问我：你知道angular指令中的controller,compile,link函数有什么不同？然后我就一脸懵逼了....于是决定深入的去探究下。今天我们来一起了解一下它们有什么不同的地方: 先看一段示例代码var ag = angular.module("myApp",[]);ag.controller("myCtrl",["$rootScope",function($rootScope){}]);ag.directiv...
本文主要设计定时器的三种循环，模板自配，下面分享给大家供大家参考，具体如下：1、$interlval实现，比较简单和原生js的setInterval比较相似var app = angular.module(myApp,[]); app.run(function($rootScope , $interval){var img=["http://hdn.xnimg.cn/photos/hdn321/20130612/2235/h_main_NNN4_e80a000007df111a.jpg" ,"http://ww2.sinaimg.cn/crop.0.0.1080.1080.1024/d773ebfajw8eum57eobkwj20u00u075w.jpg","http://h.hip...
scope是什么？ 大家都知道在AngularJS 中作用域是一个指向应用模型的对象，它是表达式的执行环境。作用域有层次结构，这个层次和相应的 DOM 几乎是一样的。作用域能监控表达式和传递事件。 在 HTML 代码中，一旦一个 ng-app 指令被定义，那么一个作用域就产生了，由 ng-app 所生成的作用域比较特殊，它是一个根作用域（$rootScope），它是其他所有$Scope 的最顶层。 除了用 ng-app 指令可以产生一个作用域之外，其他的指令如 ng-co...
前言 大家如果想在angularjs动态加载一个内容，那我们就可以使用ng-include来实现。今天Insus.NET就在ASP.NET MVC环境中，举个例子来演示它的功能。 示例介绍 你可以在一个视图动态加载任一其它视图。如果你的动态内容有很多部件，你得需要在控制器创建相应的Action操作，如使用部分Partial view就不必创建相对应的Action。因此这是Insus.NET所喜欢的。 另外，我们还需要为ng-include的链接带些参数呢！！！ 因此，参数，即是使用m...
前言 最近在做一个项目改版，第一次在项目中真正使用Angular,和平时自己写写小demo,做做练习的感觉还是非常不同的，感觉非常的新鲜。有几个指令是经常用到的，这里由于这几个有点共性，所以一起介绍一下ng-if,ng-show/ng-hide,ng-switch 这几个指令。下面来看看详细的介绍： 共性 1.这里个指令都是Angular框架提供给我们的设置页面内容显示和隐藏的方法，使用起来非常方便，尤其是做业务逻辑。 2.都是通过一个表达式...
本文主要介绍的是Angular.JS内置服务$http对数据库的增删改操作的相关内容，分享出来供大家参考学习，下面来看看详细的介绍： 一、使用$http查询MySQL数据angular.module(app,[]) .controller(MyCtrl,function ($scope,$http) {$http.get(http://127.0.0.1:80/user/getUsers).success(function (resp) {console.log(resp);}).error()//jQuery/*$.get(url,function (data) {});*/ })对应的后台Java代码：public void getUsers(){Lis...
前言 大家在平时的项目开发中，应该会经常遇到上图所示的需求，就是在一个页面中有多个标签，被选中的标签颜色会高亮显示，切换不同标签显示相应的不同内容。如果内容代码过多则写在同一个html文件就会显得特别乱，所以这里我们最好把页面代码分开单独管理，controller也可以分开来管理，这样就会显得清楚的多。 这里就要使用到Angularjs中个ng-include指令。下面来看看详细的介绍： 一、多标签的编写 首先需要了解需求： 1....
Angular 4.x 中有两种表单： Template-Driven Forms - 模板驱动式表单 (类似于 Angular 1.x 中的表单 )Reactive Forms - 响应式表单本文主要介绍 Template-Driven Forms (模板驱动式表单) ，将涉及 ngForm、ngModel、ngModelGroup、表单提交事件、表单验证和异常信息输出等内容。 ContentsngModule and template-driven formsBinding ngForm and ngModelngModel,[ngModel] and [(ngModel)]ngModels and ngModelGroupTemplate-drive...
前言 每个controller都会有自己的scope，所有的scope都是属于 $rootScope的子或者子的子... 那么问题就好解决了，通过 $rootScope.$broadcast 广播的事件每个controller都能收到事件 另外，我的经验是，尽量不要用event传数据。应该建立一个service来保存数据，并且设置相应getter/setter，具体如下： 每个controller依赖service, call service.setter(...) 统一的service.setter(...)在改完数据后可以$emit('data-updated') 每个...
前言 本文要实现的效果是在输入框内无文字时，提交button是不能点击状态，在输入文字后会变为可点击状态，效果图如下：实现方法：<div> <div> <textarea name="" id="" rows="3" class="form-control" ng-model="shyj" placeholder="在此输入审批意见"></textarea> </div> <div> <div> <button class="btn btn-sm btn-block btn-primary" ng-disabled="!shyj" ng-click="agreeClick(SM.YGBH,SM.RQ,shyj);" ng-tap="$navigate.go(/h...
一、angular根据环境配置禁用调试： // Disable debug data for production environment // @link https://docs.angularjs.org/guide/production $compileProvider.debugInfoEnabled( app.applicationEnvironment !== production); $logProvider.debugEnabled( app.applicationEnvironment !== production);上面就是根据当前的环境是不是生产环境，来禁用调试了。 二、然后angular单页web如果要禁用复制和剪切 其实实现也很简单，动...
一、引用template对于指令，可以把它简单的理解成在特定DOM元素上运行的函数，指令可以扩展这个元素的功能。 指令要生效，那么html头里面要 <html lang="en" ng-app="app">制定ng-app的值和定义指令的module名字一致： angular.module(app,[])指令的完整参数： angular.module(myApp, []) .directive(myDirective, function() {return {restrict: String,priority: Number,terminal: Boolean,template: String or Template Functio...