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. hdu 2459 (后缀数组+RMQ)

    题意:让你求一个串中连续重复次数最多的串(不重叠),如果重复的次数一样多的话就输出字典序小的那一串. 分析:有一道比这个简单一些的题spoj 687, 假设一个长度为l的子串重复出现两次,那么它必然会 ...

  2. Generate Parentheses java实现

    Given n pairs of parentheses, write a function to generate all combinations of well-formed parenthes ...

  3. 翻译【ElasticSearch Server】第一章:开始使用ElasticSearch集群(2)

    安装和配置集群(Installing and Configuring your Cluster) 第一步是确保正确安装了 Java SE环境.ElasticSearch需要版本6或更高的版本,可以从下 ...

  4. hdu 2594-Simpsons’ Hidden Talents(KMP)

    题意: 给你两个串a,b,求既是a的前缀又是b的后缀的最长子串的长度. 分析: 很自然的想到把两个串连接起来,根据KMP的性质求即可 #include <map> #include < ...

  5. 用javascript 面向对象制作坦克大战(三)

    之前,我们完成了坦克的移动和地图的绘制,这次我们来完成碰撞检测和炮弹的发射. 上代码前来张最新的类图: 3. 碰撞检测     前面我们已经完成了坦克的移动和地图的绘制,下面我们开始写碰撞检测. 3. ...

  6. KindEditor Asp.net

    最近在使用KindEditor,其中遇到三个问题: 1.textarea添加 runat="server" 后整个editor在运行的时候不能显示出来,我没找到原因,于是我就把ru ...

  7. 使用DDMS测试安卓手机APP的性能(android)

    安装/配置: 通过另外一个工具也可以测试手机客户端APP的性能,这就是android开发包中的DDMS工具(Dalvik Debug Monitor Service),先来说一下android开发包的 ...

  8. OpenGL超级宝典第5版&&GLSL法线变换

    在GLSL中,有一些情况需要把局部坐标系下的向量或点转换到视点坐标系下,如光照计算时,需要把法向转化到视点坐标系.如果是模型上一点p 转化到视点坐标系下,直接(model-view matrix )* ...

  9. 简易nagios安装

    这段时间一直在进行nagios安装的实验,进行了很多的实验,现在也就是将这些进行一些基础的记录. 本篇主要讲述的是进行nagios的简易安装,在安装完成之后,能够在web页面上看到本地的监控图像, n ...

  10. bzoj 1778 [Usaco2010 Hol]Dotp 驱逐猪猡(高斯消元)

    [题意] 炸弹从1开始运动,每次有P/Q的概率爆炸,否则等概率沿边移动,问在每个城市爆炸的概率. [思路] 设M表示移动一次后i->j的概率.Mk为移动k次后的概率,则有: Mk=M^k 设S= ...