The app structure:

Front-end: app.js

/**
* Created by Answer1215 on 12/9/2014.
*/
'use strict'; function MainCtrl(PeopleService) {
var vm = this;
vm.people = [];
vm.selectedPerson = {}; vm.getPeople = PeopleService.getPeople().then(function(response) {
vm.people = response.data;
}); vm.selectPerson = function(person) {
PeopleService.getSelectedPerson(person).then(function(response) {
vm.selectedPerson = response.data;
vm.selectedPerson.fullName = response.data.firstName + " " + response.data.lastName;
}); } } function PeopleService($http) { var PeopleService = {};
PeopleService.getPeople = function() {
return $http.get('http://localhost:3000/people');
} PeopleService.getSelectedPerson = function(person) {
return $http.get('http://localhost:3000/people/'+person._id);
} return PeopleService;
} angular.module('app',[
'ngResource'
])
.controller('MainCtrl', MainCtrl)
.service('PeopleService', PeopleService);
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
</head>
<body ng-app="app"> <div class="row" ng-controller="MainCtrl as vm">
<div class="col-xs-4">
<ul>
<li ng-repeat="person in vm.people" ng-click="vm.selectPerson(person)">{{person.firstName}}</li>
</ul>
</div>
<div class="col-xs-6">
<h2>{{vm.selectedPerson.fullName}}</h2>
<span>{{vm.selectedPerson.email}}</span>
</div>
</div>
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-resource/angular-resource.min.js"></script>
<script src="app.js"></script>
</body>
</html>

Backend:

server.js

'use strict';

var express = require('express');
var cors = require("cors");
var app = express();
app.use(cors());
var people = require('./controller/people'); app.get('/people', people.getAll);
app.get('/people/:id', people.get); app.listen(3000);

controller/people.js

/**
* Created by Answer1215 on 12/26/2014.
*/
var model = require('../model/people'); exports.getAll = function(request, response){
model.getAll(function(err, data) {
if(err) response.json(503, {error: true}); response.json(200, data);
});
} exports.get = function(request, response){
var id = request.params.id;
model.get(id, function(err, data) {
if(err) response.json(503, {error: true}); response.json(200, data);
});
}

model/people.js

/**
* Created by Answer1215 on 12/26/2014.
*/
var mongoose = require('../lib/mogoose'); var personSchema = {
firstName:String,
lastName:String,
email:String
}; //create a person model, and rename db as people
var Person = mongoose.model('Person', personSchema); exports.getAll = function(callback) {
Person.find().select("firstName").exec(function(err, data) {
// response.json(200, data);
callback(err, data);
});
} exports.get = function(id, callback){
Person.findById(id, function(err, data) {
//response.send(data);
callback(err, data);
});
}

lib/mogoose.js

/**
* Created by Answer1215 on 12/26/2014.
*/
var mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/simple'); module.exports = mongoose;

[MEAN Stack] First API -- 4. Organize app structure的更多相关文章

  1. [MEAN Stack] First API -- 7. Using Route Files to Structure Server Side API

    Currently, the server.js is going way too long. In the real world application, it is likely that we ...

  2. [MEAN Stack] First API -- 5. Using $resource to setup REST app

    Front-end changes: app.js: Uinsg $resource /** * Created by Answer1215 on 12/9/2014. */ 'use strict' ...

  3. [MEAN Stack] First API -- 3. Select by ID with Mongoose and Express

    Mongoose allows you to easily select resources by ID from your MongoDB. This is an important aspect ...

  4. [MEAN Stack] First API -- 1. with Node.js, Express and MongoDB

    Learn how to import data into your MongoDB and then use Express to serve a simple Node.js API. Impor ...

  5. Spark2.3(四十):如何使用java通过yarn api调度spark app,并根据appId监控任务,关闭任务,获取任务日志

    背景: 调研过OOZIE和AZKABA,这种都是只是使用spark-submit.sh来提交任务,任务提交上去之后获取不到ApplicationId,更无法跟踪spark application的任务 ...

  6. 淘宝用户api 如何获得App Key和API Secret

    下面我们通过截图的方式详细说明申请淘宝应用的步骤. 一.访问淘宝开放平台http://open.taobao.com/ 申请成为合作伙伴 二.填写个人信息申请入住 三.点击创建应用 四.填写应用名称, ...

  7. Andorid API Package ---> android.app

    包名: android.app                                     Added in API level 1       URL:http://developer. ...

  8. 基于腾讯云监控 API 的 Grafana App 插件开发

    Tencent Cloud Monitor App Grafana 是一个开源的时序性统计和监控平台,支持例如 elasticsearch.graphite.influxdb 等众多的数据源,并以功能 ...

  9. 使用私有api统计ios app运行时间及次数

    利用<iphone SprintBoard部分私有API总结>中提到的私有API,可以做很多越狱以前实现不了的事情. 比如,利用一个后台运行的app,监控该iphone上所有app的运行次 ...

随机推荐

  1. [Everyday Mathematics]20150210

    设正方体 $ABCD-A_1B_1C_1D_1$ 的棱长为 $1$, $E$ 为 $AB$ 的中点, $P$ 为体对角线 $BD_1$ 上一点, 当 $\angle CPE$ 最大时, 求三菱锥 $P ...

  2. Filezilla 多目录的访问设置

    [转:http://hi.baidu.com/yangjie312/blog/item/125a8405423d896d03088171.html] 设置好主目录之后,点击“Add”按钮可以把其余的目 ...

  3. 2016计蒜之道复赛 百度地图的实时路况 floyd+cdq分治

    链接:https://nanti.jisuanke.com/t/11217 奉上官方题解: 枚举 d(x , y , z) 中的 y,把 y 从这个图中删去,再求这时的全源最短路即可,使用 Floyd ...

  4. Hibernate逆向工程

    MySQL Administrator 创建表   MyEclipse Database Explorer视图: 1. New  2 .Driver template: MySQL Connector ...

  5. Chrome多线程模型

    为什么使用多线程? Chrome的多线程模型主要解决什么问题? 如何实现该问题的解决? 1. 解决问题 Chrome有很多线程,这是为了保持UI线程(主线程)的高响应度,防止被其他费时的操作阻碍从而影 ...

  6. Linux中MySQL5.5解压版普通用户安装

    #查看本机mysql 安装路径 [hadoop@SY-0134 toolkit]$ rpm -qa|grep -i mysql [hadoop@SY-0134 toolkit]$ whereis my ...

  7. SSHFS

    SSHFS(SSH文件系统) 是一个文件系统客户端程序,使用它可以将远程服务器上的目录挂载在本地直接访问 可以在网站http://igikorn.com/sshfs-windows-8/内下载

  8. fedora 安装python mysql

    如果你服务器环境允许yum,安装MySQL-python模块就很简单了. 如果直接安装不行,先 安装MySQL-devel后正常运行 yum install mysql-devel yum insta ...

  9. HDU-4734 F(x) 数位DP

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4734 注意到F(x)的值比较小,所以可以先预处理所有F(x)的组合个数.f[i][j]表示 i 位数时 ...

  10. 第二百五十六天 how can I 坚持

    今天比较闲,但是好累. 每天都会学到很多东西. 比如说,在没搞懂别人说这话之前,最好不要先表达自己的想法. 不宜妄自菲薄.不以物喜,不以己悲.hadoop. 睡觉.召生好速度啊,这么快就把我照片发给同 ...