Using MEAN.JS to Define Query Parameters for Mongo from the Client Controller

Question

Using MEAN.JS to Define Query Parameters for Mongo from the Client Controller

I am currently developing an application using the MEAN stack - MongoDB, Angular, Express, and Node.js.

To kickstart my project, I utilized the MEAN.JS generator to set up the initial structure of my application.

The articles module within my application serves as a model for reference.

As my articles collection grows to 7000 records, each with an associated date value, I noticed a decline in performance due to loading all records into memory. To address this issue, I aim to optimize by only displaying records within the date range of (1 Month Ago) to (1 Year From Now) in a table view. Currently, I achieve this by:

In the articles.client.controller.js file:

$scope.find = function() {
        $articles = Articles.query();
};

...and within articles.server.controller.js:

var now = new Date();
var aYearFromNow = new Date(now.getTime() + 86400000*365); //add a year
var aMonthAgo = new Date(now.getTime() - 86400000*30); //subtract roughly a month

exports.list = function(req, res) { Article.find().where('date').lt(aYearFromNow).gt(aMonthAgo).sort('-created').populate('user', 'displayName').exec(function(err, articles) {
        if (err) {
            return res.send(400, {
                message: getErrorMessage(err)
            });
        } else {
            res.jsonp(articles);
        }
    });
};

However, this approach lacks flexibility. My goal is to empower users to specify their desired date ranges dynamically.

How can I establish bindings in the client view to adjust query parameters in the server controller, such as 'aYearFromNow' and 'aMonthAgo'?

javascript angularjs mongodb express meanjs

Answer 1

Answer №1

One alternative approach is to include the search parameters directly in the query method like so:

 $scope.searchArt = function() {
    Articles.query({start:$scope.startDate, end:$scope.endDate}, function(results) {
        $scope.articles = results;
    });
};

Then, on the server-side controller, extract the query string parameters in this manner:

exports.searchForArticle = function(req, res) {
    Article.find().where('date').gt(req.query['start']).lt(req.query['end']).exec(function(error, articles) {
        if (error) {
            res.render('error', {
                status: 500
            });
        } else {
            res.jsonp(articles);
        }
    });
};

This method eliminates the need for additional routes or services.

Answer 2

One alternative approach is to include the search parameters directly in the query method like so:

 $scope.searchArt = function() {
    Articles.query({start:$scope.startDate, end:$scope.endDate}, function(results) {
        $scope.articles = results;
    });
};

Then, on the server-side controller, extract the query string parameters in this manner:

exports.searchForArticle = function(req, res) {
    Article.find().where('date').gt(req.query['start']).lt(req.query['end']).exec(function(error, articles) {
        if (error) {
            res.render('error', {
                status: 500
            });
        } else {
            res.jsonp(articles);
        }
    });
};

This method eliminates the need for additional routes or services.

Answer 3

Answer №2

To handle multiple parameters in your AngularJS application, you can create a new service or modify the existing one:

.factory('CustomService', ['$resource',
    function($resource) {
        return $resource('custom/:param1/:param2', {
            param1: '',
            param2: ''
        }, {
            update: {
                method: 'PUT'
            }
        });
    }
]);

Then, invoke this service in your controller :

$scope.fetchData = function() {
    $scope.data = CustomService.query({
        param1: $scope.firstParam,
        param2: $scope.secondParam
    });
};

On the server-side, set up a route :

app.route('/custom/:param1/:param2')
    .get(custom.getDataWithParams)

Implement a function in your back-end controller :

exports.getDataWithParams = function(req, res) {
    Data.find()
    .where('value')
    .lt(req.params.param1)
    .gt(req.params.param2)
    .sort('-created').populate('user', 'name')
    .exec(function(err, data) {
        if (err) {
            return res.send(500, {
                message: getErrorMessage(err)
            });
        } else {
            res.jsonp(data);
        }
    });
};

This approach should work for handling multiple parameters, but it's always recommended to test thoroughly.

Answer 4

To handle multiple parameters in your AngularJS application, you can create a new service or modify the existing one:

.factory('CustomService', ['$resource',
    function($resource) {
        return $resource('custom/:param1/:param2', {
            param1: '',
            param2: ''
        }, {
            update: {
                method: 'PUT'
            }
        });
    }
]);

Then, invoke this service in your controller :

$scope.fetchData = function() {
    $scope.data = CustomService.query({
        param1: $scope.firstParam,
        param2: $scope.secondParam
    });
};

On the server-side, set up a route :

app.route('/custom/:param1/:param2')
    .get(custom.getDataWithParams)

Implement a function in your back-end controller :

exports.getDataWithParams = function(req, res) {
    Data.find()
    .where('value')
    .lt(req.params.param1)
    .gt(req.params.param2)
    .sort('-created').populate('user', 'name')
    .exec(function(err, data) {
        if (err) {
            return res.send(500, {
                message: getErrorMessage(err)
            });
        } else {
            res.jsonp(data);
        }
    });
};

This approach should work for handling multiple parameters, but it's always recommended to test thoroughly.

Using MEAN.JS to Define Query Parameters for Mongo from the Client Controller

Answer №1

Answer №2

Similar questions

Show a variety of pictures in a random arrangement?

Using JavaScript along with Ajax and JSON allows for sending complex data structures such as objects and

Comparison of Project Structure Between Express and NestJS

Troubleshooting: Dealing with Cross-Origin Resource Sharing (CORS)

The dialog box is not taking up the full width of the browser window

Every other attempt at an Ajax request seems to be successful

Tips for retrieving Angular JSON data

Global default configuration for CKEditor in bower: config.js

The module named 'MyApp' cannot be found or accessed

Is there room for improvement in this angular directive?

`How to prevent Query parameters from being lost upon reloading in Nextjs Router while maintaining a clean URL structure?`

Flask not serving Favicon and images to a React application

How to stop empty numbers in angular.js

Axios transforms into a vow

My goal is to ensure that when a user copies the URL of a website from the address bar and pastes it into a social media app, the link automatically transforms into the title of

Sending data from a partial view to a controller

Best method for creating HTML elements with jQuery

Transfer PDF file to user's web browser through XMLHttpRequest, utilizing up-to-date HTML5 techniques, all while maintaining the integrity of the document's encoding

Ways to identify the active anchor within an li element

What is the reason behind Next.js inability to import files within a directory?