AngularJS connection with MongoDB

Question

I have made one simple HTML file in angular. I want to connect my form to MongoDB.

I have attached my "html file" and "JS File".

HTML FIle

var app = angular.module('example',[]);

app.controller('TestController', function(){

 $scope.user.name= "Hello";
 $scope.user.mail = "test@gmail.com";
});

<html>
</!DOCTYPE html>
<html>
<head>
 <title>TEST Page</title>

<!-- begin snippet: js hide: false console: true babel: false -->

</head>
<body ng-app="example" ng-controller="TestController">
<table>
    <tr>
        <td>Name:</td>
        <td><input type="text" ng-model="user.name"></td>
    </tr>
    <tr>
        <td>Email:</td>
        <td><input type="text" ng-model="user.mail"></td>
    </tr>
    <tr>
        <td colspan="2"><button ng-click="getData()"></button></td>
    </tr>
</table>
</body>
</html>

Please help me......

you have to use a server side language like php to do that. and you have to use $http to connect to server side language — Gaurav Srivastava, Sep 23 '16 at 06:12
you have to write server side code to do that or you can use some BAAS like firebase or loopback — Ishank Gulati, Sep 23 '16 at 06:19
Can you Just Elaborate your explanation by running the Code Snippet — Juned Laliwala, Sep 23 '16 at 06:30
You need a server with support for mongodb driver to make entry into Mongo. In short post the entries into a running server and server will have a connection to mongoDB where it will insert the entries into collection — Rahul Kumar, Sep 23 '16 at 07:20

score 1 · Answer 1 · answered Sep 23 '16 at 06:50

1

If you start mongod with the --rest parameter you can access your DB collections via RESTful endpoints like:

http://ip:port/database/collection/?filter_name=filter_param

So you can make a AJAX request and get the required data as JSON

For more details check the https://docs.mongodb.com/ecosystem/tools/http-interfaces/#rest-interfaces

answered Sep 23 '16 at 06:50

Arun Ghosh

7,634
1
26
38

I have tried this but I am getting the message as "It looks like you are trying to access MongoDB over HTTP on the native driver port." I am having the collections, and inside the collections I have also defined some values. – Juned Laliwala Sep 23 '16 at 07:07

score 0 · Answer 2 · answered Sep 23 '16 at 06:15

To get data from mongodb you need to have a server (with your mongo model) which authorizes the client to grep the data and returns it to the client.Because we don't trust the client.

Your approach is to make a serverless application. You can use angularjs with firebase for exemple.

martin fowler serverless articles

score 0 · Answer 3 · edited Oct 02 '16 at 16:57

0

It seems that you are new in AngularJs and MongoDB.

Let me try to explain how they all works.

Communication with $http To get / post data from / to server.

var app = angular.module('example',[]);
app.controller('TestController',['$scope', '$http', function ($scope, $http) {
    //Get data from server
    $http.get("server.php")
        .then(function(response) {
            //First function handles success
            $scope.content = response.data;
        }, function(response) {
            //Second function handles error
            $scope.content = "Something went wrong";
    });
});

Server.php will communicate with the database and send to Angular (client).

//$data will be from database
return json_encode($data);

AngularJS is a JavaScript Framework (Client)

It can be added to an HTML page with a <script> tag.
It is a library written in JavaScript.

MongoDB (Database Server)

MongoDB is an open source database that uses a document-oriented data model.

Now you need a server to communicate / create a web application. Nowadays, PHP / NodeJs can be used to create a web application.

AngularJs + PHP

Few of the references

CRUD example with AngularJs+PHP+MongoDB

AngularJs example with PHP

10 AngularJs CRUD examples

AngularJs + NodeJs + MongoDb

Todo App with NodeJs + AngularJs

edited Oct 02 '16 at 16:57

Mr Lister

45,515
15
108
150

answered Sep 23 '16 at 06:46

Mohit Tanwani

6,608
2
14
32

Thanks for your positive response....But can you please explain the code for "content.php" that you have included. – Juned Laliwala Sep 23 '16 at 07:03
@JunedLaliwala : No problem, I've already few of the examples in my answer for your reference. – Mohit Tanwani Sep 23 '16 at 07:05
See I have created one Collection in MongoDB....Inside that collection "mycol" (name of collection)....I have defined some values......when I am trying to access that collection values......I am getting the message in the browser as :"It looks like you are trying to access MongoDB over HTTP on the native driver port.".........my url is : "http://localhost:27017/myDB/mycol/" – Juned Laliwala Sep 23 '16 at 07:12
@JunedLaliwala Nobody can see, what you're localhost doing :) That your local system only. If possible put your full code or visit links I've added in my answer that will definitely helps you to do it. – Mohit Tanwani Sep 23 '16 at 07:14
this is my server.js file...................................................................var mongoose = require('mongoose'); var db = mongoose.connection; db.on('error', console.error); db.once('open', function() { mongoose.connect('mongodb://localhost/myDB'); – Juned Laliwala Sep 23 '16 at 08:29
if u dnt mind can i have ur mail ID....so that we can contact easily....m from Ahmedabad – Juned Laliwala Sep 23 '16 at 08:32
@JunedLaliwala Are you using nodejs or php for server side ? – Mohit Tanwani Sep 23 '16 at 08:47
@JunedLaliwala I've already provided you the help of connecting with NodeJs, please check it. http://javabeat.net/nodejs-mongodb/ https://scotch.io/tutorials/using-mongoosejs-in-node-js-and-mongodb-applications – Mohit Tanwani Sep 23 '16 at 08:59

AngularJS connection with MongoDB

3 Answers3

Linked