这个服务可以创建一个资源对象，我们可以用它非常方便地同支持RESTful的服务端数据源进行交互，当同支持RESTful的数据模型一起工作时，它就派上用场了。 REST是Representational State Transfer（表征状态转移）的缩写，是服务器用来智能化地提供数据服务的一种方式 1）我们首先需要引入ng-Resource 模块，在angular之后 <script src="js/vendor/angular.js"></script> <script src="js/vendor/angular-resource.j...
现在的前端项目中基本上都会用到angularjs框架，之前并不了解这个框架，也是因为最近接手的项目，所以打算好好的学习下它。之前都是搞pc端，现在接手的是移动端的项目，移动端UI框架用的是ionic＋vordova，没有用bootstrap，主要做的是ios+安卓的app界面，ionic这个框架也不太了解，也需要花时间好好熟悉下。angularjs学习小白一枚，欢迎大神指正。 AngularJs是什么？ 简单来说，即javascript的一个框架，通过script标签添加到...
最近在和几个同事研究mean（mongodb+express+angularjs+nodejs），这个框架看了个皮毛，但是安装部分基本上已经掌握了，目前还没有找到好的一键部署方案，所以我给同事们做了一个基础部署的脚本，本来想的很好，但是一次次的测试也比较浪费时间，基本功能完成之后，就没有再进一步的优化，先放出来大家看看吧，用某前辈的话说：这个东西不算脚本，只能算“顺溜”，一步步完成安装和配置。系统环境：650) this.width=650;" src="/up...
AngularJS orderBy 使用要点总结： 1，书写格式基本应用格式为：ng-repeat="item in itemList | orderBy:p1:p2"参数p1可以是字段名或自定义函数，p2指是否逆序，默认是false举例：假设$scope中有var itemList=[{id:201,name:‘abc‘,amount:100},{id:100,name:‘zdb‘,amount:100},{id:10,name:‘xxx‘,amount:200},{id:80,name:‘231‘,amount:1020},{id:50,name:‘ppp‘,amount:20},{id:1,name:‘hhh‘,amount:1100}];按照id，...
一、JQuery与AngularJS首先，先简单的比较一下JQuery与AngularJS。二、Ajax请求与数据遍历打印这里是Ajax和$http请求的JSON文件概览，默认的路径我们就放在与两者同级的文件夹里。[{"name": "一号","age": 17,"hobby": ["吃","喝"],"score":{"math":78,"chinese":89}},{"name": "二号","age": 17,"hobby": ["喝","玩"],"score":{"math":78,"chinese":89}},{"name": "三号","age": 17,"hobby": ["玩","乐"],"score":{"math":78,"chi...
一、DI-控制器参数$scope - 在js和html之间传递数据 - 仅在控制器作用域内有效$element - 是一个jQuery对象 - 作用域控制器所在的html元素 - 在js中，通过$element获取DOM对象 - var e = $element.children().eq(0); - $scope.w = e.width(); - $scope.h = e.height();$http - http协议请求 - $http.get(url).success(function(result){});二、DI-监听$watch - 监听变化 - 语法 - $scope.$watch(...
angularjs是一个为动态web应用设计的结构框架，它是为了克服html在构建应用上的不足而设计的。工作原理：1 加载html，然后解析成DOM；2 加载angular.js脚本；3 AngularJS等待DOMContentLoaded事件的触发；4 AngularJS寻找ng-app指令，根据这个指令确定应用程序的边界；5 使用ng-app中指定的模块配置$injector；6 使用$injector创建$compile服务和$rootScope；7 使用$compile服务编译DOM并把它链接到$rootScope上；8 ng-init指令对s...
1、 下载angular-seed-master-master包，解压缩后将新版本的angularJS文件放入其中。 2、 制作frontmockup文件夹（前端调用），同时制作backmockup文件夹（后端调用），使用IIS开启2个webserver（此步骤可以用其他方式替代）。 3、 backmockup站点添加以下HTTP头Access-Control-Allow-Credentials：trueAccess-Control-Allow-Headers：origin,x-requested-with,content-typeAccess-Control-Allow-Methods： POST,GET,OPTIONSAcc...
本人学习JS和AngularJS时做的笔记。JavaScript：基础知识：定义变量：var（全局或函数作用域）；let、const（块作用域、不提升变量）；Tips：直接使用x=1会将x转换为全局变量，严格模式（“use strict”）报错；数据类型：Boolean、Number、String、Object、Null、Undefined；布尔值：false、null、undefined、0、NaN、””（空字符串）等价false，其余为true；比较：===（类型相同，值相同），==（会进行类型转换），对象比较引用...
1、index.html:<!DOCTYPE HTML><html ng-app="app"><head> <title>custom-directive</title> <meta charset="utf-8"> <link rel="stylesheet" href="../css/bootstrap.css"> <script src="../js/angular.js"></script></head><body><!-- 下面是指令与控制器交互的demo. --><div ng-controller="myCtrl"> <loader>滑动加载</loader></div><script src="./directive-controller.js"></script></body></html>2、di...
$scope.del = function(id){ tips.showConfirm(‘确定要取消该收藏?‘, function(){ $apis.delete(API.COMPONENT+‘/api/component/favourite/‘+id,function(r){ if(r.result=="success"){ tips.showSuccess("成功取消收藏！"); $scope.loadFavours(); }else{ tips.showFailure(r.data.content); } }); }); }; 在IE8下，会显示消息: 缺少标识符，即IE8 complains that "expected identifier" on the...
html<!DOCTYPE html><html ng-app="APP"><head><title></title><link rel="stylesheet" type="text/css" href="main.css"></head><body ng-controller="MainCtrl"><div><ul><li><a ui-sref="home">home</a></li><li><a ui-sref="contact">contact</a></li><li><a ui-sref="about">about</a></li></ul><div ui-view ng-class="{true:‘slide-left‘,false:‘slide-right‘}[leftorright]"></div><div><script type="text/javascri...
转载自：http://my.oschina.net/brant/blog/419641一、启动阶段 大家应该都知道，当浏览器加载一个HTML页面时，它会将HMTL页面先解析成DOM树，然后逐个加载DOM树中的每一个元素节点。我们可以把AngularJS当做一个类似jQuery的js库，我们通过<script>标签引入到HTML中，那么此时Angular就做为一个普通的DOM节点等待浏览器解析，当浏览器解析到这个节点时，发现它是一个js文件，那么浏览器会停止解析剩余的DOM节点，开始执行这...
Model的应用 MVC的模式大家都是十分熟悉了，那么Angular是怎么规划的呢。数据被放在json文件中，通过Ajax获取数据。[{ "action": "Buy Flowers", "done": false},{ "action": "Get shoes", "done": false },{ "action": "Call Leona", "done": true },{ "action": "Collect Tickets","done": false}] <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ng-app="todoApp" > <head> <meta http-equiv="...
There are situations where you might want to add additional methods toangular.module. This is easy to accomplish, and can be a handy technique. //For directive template<hello></hello>//For directive controller<li menu-item ng-repeat="category in categories"class="menu-animation"ng-class="{‘highlight‘:mouse_over}"ng-mouseenter="mouse_over = true"ng-mouseleave="mouse_over = false"ng-class="{‘a...