将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'; / ...
随机推荐
- Redis配置中文翻译,3.2.1版
大部分常见设置都翻译了,还有一些是从网上复制的(懒) # Redis configuration file example. ## Redis配置文件示例 # # Note that in order ...
- 如何找到Linux下常用命令的源码
Linux系统,常用命令的来源很多,有些命令是shell自带的,比如cd,通过执行help命令,可以查看当前系统所有的内置命令. 用type <cmd_name>来查看一个命令是否为内置命 ...
- 一个CFile::Remove引起的奇怪问题
今天收到测试的一个反馈,我们的一个程序,在WIN7.WIN8下安装后,运行不起来,在进程列表中可以看到,但就是不出来窗口,同样的程序在XP下正常,在UAC关闭的情况下也正常,在以管理员权限运行时也正常 ...
- Java中的队列：java.util.Queue接口
队列是一种特殊的线性表,它只允许在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作. Queue接口与List.Set同一级别,都是继承了Collection接口.Linked ...
- Jquery-zTree的基本用法
[简介] zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件 兼容 IE.FireFox.Chrome 等浏览器 在一个页面内可同时生成多个 Tree 实例 ...
- MongoDB的安全性
上篇文章介绍Mongo启动了,一般数据库启动,下面的操作就是登录数据库了,之前测试数据库是否正常安装的时候也登录过数据库,现在回想一下,好像连用户名和密码都没有输入,找几篇帖子来探究下Mongodb的 ...
- 安装完MySQL后必须要调整的10项配置
2014年02月10日11:11 来源:开源中国 作者:BoydWang, 美好的2014, DrZ 编辑:徐志远 标签: 配置 , mysql , 数据库 [IT168 评论]当我们被人雇来监测My ...
- 我的第一个canvas的作品：漫画对白编辑器
背景:一直都对canvas挺有有兴趣的,之前刚刚看了<HTML5 CANVAS基础教程>,写了篇读书笔记. 起因:老婆发来一张最近比较热的漫画图(友谊的小船说翻就翻什么的).这种漫画,经常 ...
- Delphi Base64 编解码函数
Delphi 自带 Base64 编解码的单元, EncdDecd这个单元提供两套四个公开函数: 对流的编解码:procedure EncodeStream(Input, Output: TStrea ...
- oracle linux了解基本命令行
1. Linux的版本:核心(kernel)版本和发行(distribution)版本 2. 复制.删除和移动文件的命令 cp [选项] 源文件或目录 目标文件或目录 -R,-r ...