In this articles will teach how how to search records Node js Express Mongodb.how the search functionality works.
Create the Node js Project using following command
1 | npm init |
Install the following dependencies
- npm i mongoose
- npm i express
- npm install –save-dev nodemon
Server.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | const express = require('express') const sever = express() const port = 4000 var routes = require('./routes/routes'); var mongoose = require('mongoose'); mongoose.set('strictQuery', true); mongoose.connect("mongodb://127.0.0.1:27017/dbschool",{useNewUrlParser: true, useUnifiedTopology: true },function checkDb(error) { if(error) { console.log(error); } else { console.log("successfully Connected to DB"); } }); sever.use(express.json()); sever.use(routes); sever.listen(port, () => { console.log(`Express port successfully ${port}`) }) |
routes.js
1 2 3 4 5 6 7 8 | var express = require('express'); var userController = require('../src/employee/userController'); const router = express.Router(); router.route('/user/findOne/:name').get(userController.findOneUserController); module.exports = router; |
userController.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | var userService = require('./userService'); var findOneUserController = async (req, res) => { console.log(req.params.name ); var result = await userService.findOneUserDBService(req.params.name ); if (result) { res.send({ "status": true, "data": result} ); } else { res.send({ "status": false, "data": "User not found" }); } } module.exports = { findOneUserController}; |
userModel.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | var mongoose = require('mongoose'); var Schema = mongoose.Schema; var userSchema = new Schema({ name: { type: String, required: true }, address: { type: String, required: true }, phone: { type: String, required: true } }); module.exports = mongoose.model('employees', userSchema); |
userService.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | var userModel = require('./userModel'); module.exports.findOneUserDBService = (userDetais) => { return new Promise(function myFn(resolve, reject) { userModel.findOne({name:userDetais}, function returnData(error, result) { if(error) { reject(false); } else { resolve(result); } }); }); } |
Installing Angular CLI
1 | npm install -g @angular/cli |
After that create the new Project of Angular running by the following command
1 | ng serve |
then you have create the following components by typing the command
1 | ng g c search |
After that add module inside app.module.ts
inside the imports section add the FormsModule and HttpClientModule
if the path is not get automatically copy and paste it
import { HttpClientModule } from ‘@angular/common/http’;
app.module.ts
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { BrowserModule } from '@angular/platform-browser'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { SearchComponent } from './search/search.component'; import { HttpClientModule } from '@angular/common/http'; @NgModule({ declarations: [ AppComponent, SearchComponent ], imports: [ BrowserModule, AppRoutingModule, FormsModule, HttpClientModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <div class="container mt-4" > <div class="card"> <h1>Search</h1> <form> <div class="form-group"> <label>Name</label> <input type="text" [(ngModel)]="name" [ngModelOptions]="{standalone: true}" class="form-control" id="name" placeholder="Enter Name"> <button type="submit" class="btn btn-primary mt-4" (click)="Search()" >Search</button> </div> </form> <hr/> <br/> <div class="form-group"> <label>address</label> <input type="text" [(ngModel)]="address" [ngModelOptions]="{standalone: true}" class="form-control" id="address" placeholder="Enter address"> </div> <div class="form-group"> <label>Phone</label> <input type="text" [(ngModel)]="phone" [ngModelOptions]="{standalone: true}" class="form-control" id="phone" placeholder="Enter Mobile"> </div> </div> <div> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 | import { HttpClient } from '@angular/common/http'; import { Component } from '@angular/core'; @Component({ selector: 'app-search', templateUrl: './search.component.html', styleUrls: ['./search.component.scss'] }) export class SearchComponent { name: string =""; address: string =""; phone: Number =0; constructor(private http: HttpClient ) { } Search() { this.http.post("http://localhost:4000/user/findOne/" + this.name , {responseType: 'text'}).subscribe((resultData: any)=> { console.log(resultData); if(resultData.data =='User not found') { alert("Record Not Found") } else { this.address = resultData.data.address; this.phone = resultData.data.phone; } }); } } |
