Skip to content

Instantly share code, notes, and snippets.

@liorkesos
Last active May 23, 2016 09:21
Show Gist options
  • Save liorkesos/f7c37af40a2399a821bd to your computer and use it in GitHub Desktop.
Save liorkesos/f7c37af40a2399a821bd to your computer and use it in GitHub Desktop.
Up the MEAN stack - Package flow...
'use strict';
/**
* Module dependencies.
*/
var mongoose = require('mongoose'),
Schema = mongoose.Schema;
/**
* Article Schema
*/
var ArticleSchema = new Schema({
created: {
type: Date,
default: Date.now
},
title: {
type: String,
required: true,
trim: true
},
content: {
type: String,
required: true,
trim: true
},
user: {
type: Schema.ObjectId,
ref: 'User'
}
});
/**
'use strict';
angular.module('mean').controller('ArticlesController', ['$scope', '$stateParams', '$location', 'Global', 'Articles',
function($scope, $stateParams, $location, Global, Articles) {
$scope.global = Global;
$scope.hasAuthorization = function(article) {
if (!article || !article.user) return false;
return $scope.global.isAdmin || article.user._id === $scope.global.user._id;
};
$scope.create = function(isValid) {
if (isValid) {
var article = new Articles({
title: this.title,
content: this.content
});
article.$save(function(response) {
$location.path('articles/' + response._id);
});
this.title = '';
this.content = '';
} else {
$scope.submitted = true;
}
};
$scope.remove = fu
'use strict';
//Articles service used for articles REST endpoint
// Note how it returns a resource and that is where the .$save in the controller above comes from.
angular.module('mean').factory('Articles', ['$resource',
function($resource) {
return $resource('articles/:articleId', {
articleId: '@_id'
}, {
update: {
method: 'PUT'
}
});
}
]);
'use strict';
var articles = require('../controllers/articles');
// Article authorization helpers
var hasAuthorization = function(req, res, next) {
if (!req.user.isAdmin && req.article.user.id !== req.user.id) {
return res.send(401, 'User is not authorized');
}
next();
};
module.exports = function(Articles, app, auth) {
app.route('/articles')
.get(articles.all)
.post(auth.requiresLogin, articles.create);
// this .post is what gets triggered when we access the server in the create route
app.route('/articles/:articleId')
.get(articles.show)
.put(auth.requiresLogin, hasAuthorization, articles.update)
.delete(auth.requiresLogin, hasAuthorization, articles.destroy);
// Finish with setting up the articleId param
app.param('articleId', articles.article);
};
...
/**
* Create an article
*/
exports.create = function(req, res) {
var article = new Article(req.body);
article.user = req.user;
article.save(function(err) {
if (err) {
return res.jsonp(500, {
error: 'Cannot save the article'
});
}
res.jsonp(article);
});
};
/**
* Update an art ...
<section data-ng-controller="ArticlesController"> <!-- note the articlesController and the create functon upon submit below -->
<form name="articleForm" class="form-horizontal col-md-6" role="form" data-ng-submit="create(articleForm.$valid)" novalidate>
<div class="form-group" ng-class="{ 'has-error' : submitted && articleForm.title.$invalid }">
<label mean-token="'create-title'" class="col-md-3 control-label">Title</label>
<div class="col-md-9">
<input name="title" type="text" class="form-control" data-ng-model="title" id="title" placeholder="Title" required>
<div ng-show="submitted && articleForm.title.$invalid" class="help-block">
<p ng-show="articleForm.title.$error.required">Title is required</p>
</div>
</div>
</div>
<div class="form-group" ng-class="{ 'has-error' : submitted && articleForm.content.$invalid }">
<label mean-token="'create-content'" for="content" class="col-md-3 control-label">Content</label>
<div class="col-md-9">
<textarea name="content" data-ng-model="content" id="content" cols="30" rows="10" placeholder="Content" class="form-control" required></textarea>
<div ng-show="submitted && articleForm.content.$invalid" class="help-block">
<p ng-show="articleForm.content.$error.required">Content is required</p>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-3 col-md-9">
<button type="submit" class="btn btn-info">Submit</button>
</div>
</div>
</form>
</section>
In MEAN data is collected and communicated in the package and it goes through the different layers of angular, express and mongo.
The data "moves" "up the stack" from the angular view to the controller and then the service and from then to an express route a controller and model schema which is used to save the object in the db.
We'll use the create.html from the articles core package to demonstrate this.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment