将ANGULAR与后端请求结合
简单的结合，却是很多应用的基础。RESTFUL就此而生。瘦服务，富客户。
<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Data Binding Example</title>
</head>
<body>
<div ng-controller="main">
<input type="text" ng-model="firstName" placeholder="firstname">
<input type="text" ng-model="lastName" placeholder="lastname">
<table>
<tr ng-repeat="p in employees">
<td>{{p.id}}</td>
<td><span>{{p.first}} {{p.last}}</span></td>
</tr>
</table>
</div>
<div ng-controller="logger">
<pre>
<p ng-repeat="e in events track by $index">{{$index}} - {{e}}</p>
</pre>
</div>
<script src="http://cdn.bootcss.com/angular.js/1.4.8/angular.min.js"></script>
<script>
var app = angular.module('app', []);
app.controller('main', ['$scope', '$http', '$rootScope', function($scope, $http, $rootScope) {
$scope.employees = [];
$scope.firstName = $scope.lastName = '';
$http.get('/employees').success(function(data) {
$scope.employees = data;
$rootScope.$emit('log', 'GET /employees success');
});
}]);
app.controller('logger', ['$scope', '$rootScope',function ($scope, $rootScope) {
$scope.events = [];
$rootScope.$on('log', function (event, data) {
$scope.events.push(data.trim());
});
}]);
</script>
</body>
</html>
将ANGULAR与后端请求结合的更多相关文章
- angular的post请求,SpringMVC后台接收不到参数值的解决方案
这是我后台SpringMVC控制器接收isform参数的方法,只是简单的打出它的值: @RequestMapping(method = RequestMethod.POST) @ResponseBod ...
- 解决angular的post请求后SpringMVC后台接收不到参数值问题的方法
这是我后台SpringMVC控制器接收isform参数的方法,只是简单的打出它的值: @RequestMapping(method = RequestMethod.POST) @ResponseBod ...
- express搭建后端请求路由，前端进行访问对应的接口 后端解决跨域
代码在 ==>E:\nodes实战\myserve\testserve 1 express搭建后端请求路由,前端进行访问对应的接口 1) 创建项目目录 express 项目名 -e 然后按照提示 ...
- 实现Web请求后端Api的Demo，实现是通过JQuery的AJAX实现后端请求，以及对请求到的数据的解析处理，实现登录功能
本篇实现Web请求后端Api的Demo,实现是通过JQuery的AJAX实现后端请求,以及对请求到的数据的解析处理,实现登录功能需求描述:1. 请求后端Api接口地址2. 根据返回信息进行判断处理前端 ...
- 关于 Angular 跨域请求携带 Cookie 的问题
在前端开发调试接口的时候都会遇到跨域请求的问题.传统的方式是使用 Nginx 反向代理解决跨域.比如所有接口都在 a.com 的域下,通过 Nginx 将所有请求代理到 a.com 的域下即可. 使用 ...
- Vue向后端请求课程展示
1.Vue结构 App.vue <template> <div id="app"> <router-link to="/index" ...
- flask 框架 前端和后端请求超时问题
部署模式 flask + Gunicorn + nginx 为什么要用Gunicorn + nginx ? 请看知乎大神们的回答:https://www.zhihu.com/question/3852 ...
- axios向后端请求解决跨域问题
我要向后端的请求的url是 http://192.168.3.25/ productInfo/insert 我是先用niginx转成localhost:8081 找conf/ nginx.conf , ...
- angular cli http请求封装+拦截器配置+ 接口配置文件
内容:接口配置文件.http请求封装 .拦截器验证登录 1.接口配置文件 app.api.ts import { Component, OnInit } from '@angular/core'; / ...
随机推荐
- 修改Windows硬盘分区名称
本文由 www.169it.com 收集整理 如果用户在将 XP 重装成Win7/Win8时,原本的硬盘分区名称可能会出现无法更改的情况,重新命名也都起不了作用.这种情况一般是因为使用 XP 系统下 ...
- streams 日差管理及监控
第一部分 stream环境的日常管理 1.capture进程管理 --capture进程信息 SET LINESIZE 200 COLUMN CAPTURE_NAME HEADING 'Capture ...
- 写在十年 2007-09-15 （写给L之三）
你知道吗? 那种时间很远,但心很近的感觉. 时间已经远去了十年, 但亲切的感觉依然清晰可见, 无论时光远去了十年,二十年,三十年, 永远…… 它已经植根,在心间……
- [Guava学习笔记]Collections: 不可变集合, 新集合类型
我的技术博客经常被流氓网站恶意爬取转载.请移步原文:http://www.cnblogs.com/hamhog/p/3843386.html,享受整齐的排版.有效的链接.正确的代码缩进.更好的阅读体验 ...
- PDF编辑、删除、替换某页面或文字
在工作中,我们常常会用到PDF,当然尤其是会计,我虽然是程序员,但是“小老鼠”是会计,前几天,突然问我,怎么样将PDF中的某个页面替换掉,也就是删掉某页然后再从另外一个地方找一页补上来: 还需要改变这 ...
- background之你不知道的background-position
这是一个有趣的话题 其实我并不确切的平时大家是怎么去应用或者玩转一个属性,一个值.我能肯定的是这些东西都有不少的可玩性. 我今天要聊的 background-position 应该已经被大家玩得色彩斑 ...
- Spark Streaming揭秘 Day12 数据安全容错(Executor篇)
Spark Streaming揭秘 Day12 数据安全容错(Executor篇) 今天,让我们研究下SparkStreaming在Executor端的数据安全及容错机制. 在SparkStreami ...
- Spark Streaming揭秘 Day10 从BlockGenerator看接收数据的生命周期
Spark Streaming揭秘 Day10 从BlockGenerator看接收数据的生命周期 昨天主要介绍了SparkStreaming中对于Receiver的生命周期管理,下面让我们进入到Re ...
- python字典操作
Python字典是另一种可变容器模型,且可存储任意类型对象,如字符串.数字.元组等其他容器模型.一.创建字典字典由键和对应值成对组成.字典也被称作关联数组或哈希表.基本语法如下: 代码如下: dict ...
- 在SAE上同步djanogo的mysql数据库
折腾了一个下午,终于搞掂了把djanogo应用的mysql数据库导入到SAE上了,归根到底麻烦的根源是SAE限制多多.下面简单记录一下过程以备日后参考使用. 首先还是修改settings.py,把数据 ...