【angularJS实战（一）】的更多相关文章

AngularJS实战之Controller之间的通信

我们时常会在不同controller之间进行通信,接下来就介绍三种controller之间的通信方式 一.使用$on.$emit和$broadcast进行controller通信 虽然AngularJS是不推荐使用嵌套controller的使用,但是会有场景使用到父子controller传值的情况 $on.$emit和$broadcast使得event.data在controller之间的传递变的简单. $emit:子传父  传递event与data $broadcast:父传子 child c…

AngularJS实战项目（Ⅰ）--含源码

前言 钻研ABP框架的日子,遇到了很多新的知识,因为对自己而言是新知识,所以经常卡在很多地方,迟迟不能有所突破,作为一个稍有上进心的程序员,内心绝对是不服输的,也绝对是不畏困难的,心底必然有这样一股力量“I must conquer it!”.比如,以前没用过AutoMapper,那我就去学,最后将学到的写成了博客,和大家一起分享,争取让那些还没接触的人少走弯路.现在,在前端设计时,ABP很多用到的都是AngularJS,而之前做项目都是用的JQuery,所以继续研究ABP也是相当有阻力.但是,…

AngularJs学习笔记-慕课网AngularJS实战

第1章 快速上手 放弃了IE8以及以下,不支持. 4大核心特性: 1.MVC Model: 数据模型 View:视图 Controller:业务逻辑和控制逻辑 好处:职责清晰,模块化. 2.模块化 3.指令系统 (AngularJs特有的) 4.双向数据绑定(AngularJs特有的) 开发工具: webstorm最强大,占用资源比较多.轻量级:sublime. 调试工具:chrome插件batarang, 它是专门针对angularJS的. 版本管理工具: git小乌龟 基于nodejs的开发…

AngularJS 实战讲义笔记

第一部分 快速上手 1.1 感受AngularJs四大核心特性(MVC, 模块化,指令系统,双向数据绑定)1.2 搭建自动化的前端开发,调试,测试环境 代码编辑工具 (sublime) 断点调试工具 (AngularJS Batarang.chrome) 版本管理工具 (git.tortoisegit) 代码合并和混淆工具 (grunt) 依赖管理工具 (bower 适用于大型项目.轻量级Server---http-server) 单元测试工具 (karma .jasmine) 集成测试工具 (…

[置顶] AngularJS实战之路由ui-sref-active使用

当我们使用angularjs的路由时,时常会出现一个需求,当选中菜单时把当前菜单的样式设置为选中状态(多数就是改变颜色) 接下来就看看Angular-UI-Router里的指令ui-sref-active 的使用 其意思就是查看当前激活状态并设置 Class 代码: <!DOCTYPE html> <html ng-app="app"> <head> <title>嵌套视图</title> <meta http-equi…

《AngularJs实战》学习笔记(慕课网)

1. Controller使用过程中的注意点 不要试图去复用Controller, 一个控制器一般只负责一小块视图 不要在Controller中操作DOM, 这不是控制器的职责. 封装在指令里. 不要在Controller中做数据格式化, ng有很好用的表单控件 不要在Controller里面做数据过滤操作, ng有$filter服务 一般来说, Controller是不会互相调用的, 控制器之间的交互会通过事件进行  ---> 这是强耦合 2. <html ng-app> <!-…

angularjs实战

1.指令  transclude 保留原来的内容 replace 去掉<my-directive>指令 <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> <div ng-app="a"> <my-directive><div>这是原来的<p>this is p</…

angularJS实战（一）

angular实现列表 accessCtrl.js let AccessCtrl = function($scope, AlertService, DialogService, BigDataService, AdminBigDataService) { let vm = $scope; vm.pager = { pageNo:1, pageSize: 10, totalCount: 0 }; vm.dataSourceTypeList=[ { id:"1", name:"D…

AngularJS实战之cookie的读取

<!DOCTYPE html> <html ng-controller="cookies_controller"> <head> <title>cookies.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="desc…

AngularJS实战之ngAnimate插件实现轮播

第一步:引入angular-animate.js 第二步:注入ngAnimate var lxApp = angular.module("lxApp", [ 'ngAnimate' ]); 第三步:定义controller,设置好三张轮播图片 .z_login_bg1 { position: absolute; width: 100%; height: 100%; left: 0; background-size: cover; background-repeat: no-repeat…