Vfrdtyky

Below is my api.ts file for connecting to MongoDb,which I am using to get the data from services collection and store it in a result.

import { MongoClient } from 'mongo-client';

import { Injectable } from '@angular/core';



@Injectable({

    providedIn: 'root'

})

export class mongoConnection {

    constructor(private mongoClient: MongoClient) { }



    getConnection() {

        let url = "mongodb://localhost:27017/";



        this.mongoClient.connect(url, function (err, db) {

            if (err) throw err;

            let dbo = db.db("mycustomers");

            dbo.collection("services").find({}), function (err, result) {

                if (err) throw err;



                console.log(result);

                db.close();

                return result;

            }

        });

        return null;

    }

}

and the services.component.ts file.

import { Component, OnInit } from '@angular/core';

import { DataService } from '../data.service';

import { Options } from 'ng5-slider';



import {mongoConnection} from '../api';

import { Observable } from 'rxjs';

import { trigger, style, transition, animate, keyframes, query, stagger } from '@angular/animations';

import { FormGroup, FormBuilder } from '@angular/forms';

import { Item } from '../Item';

import { Bus } from '../Bus';

@Component({

  selector: 'app-services',

  templateUrl: './services.component.html',

  styleUrls: ['./services.component.css'],



    export class ServicesComponent implements OnInit {



    buses$: Object;



     services:string;

            buses=;



      constructor(private data: DataService, private data1: mongoConnection) { }



      ngOnInit() {

        this.services= this.data1.getConnection();



        this.data.getBuses().subscribe(

          (data => this.buses$ = data)

        )

       }

    }

I am unable to build the project, buliding it is producing below errors.

ERROR in ./node_modules/mongo-client/node_modules/bson/ext/index.js

Module not found: Error: Can't resolve '../build/Release/bson' in '/home/pavan/Desktop/apstrtcAngular/node_modules/mongo-client/node_modules/bson/ext'

ERROR in ./node_modules/mongo-client/node_modules/bson/ext/index.js

Module not found: Error: Can't resolve './win32/ia32/bson' in '/home/pavan/Desktop/apstrtcAngular/node_modules/mongo-client/node_modules/bson/ext'

ERROR in ./node_modules/mongo-client/node_modules/bson/ext/index.js

Module not found: Error: Can't resolve './win32/x64/bson' in '/home/pavan/Desktop/apstrtcAngular/node_modules/mongo-client/node_modules/bson/ext'

ERROR in ./node_modules/mongo-client/node_modules/mongodb/lib/mongodb/db.js

Module not found: Error: Can't resolve 'crypto' in '/home/pavan/Desktop/apstrtcAngular/node_modules/mongo-client/node_modules/mongodb/lib/mongodb'

ERROR in ./node_modules/mongo-client/node_modules/mongodb/lib/mongodb/commands/db_command.js

Module not found: Error: Can't resolve 'crypto' in '/home/pavan/Desktop/apstrtcAngular/node_modules/mongo-client/node_modules/mongodb/lib/mongodb/commands'

ERROR in ./node_modules/mongo-client/node_modules/mongodb/lib/mongodb/connection/url_parser.js

Module not found: Error: Can't resolve 'fs' in '/home/pavan/Desktop/apstrtcAngular/node_modules/mongo-client/node_modules/mongodb/lib/mongodb/connection'

ERROR in ./node_modules/mongo-client/node_modules/mongodb/lib/mongodb/gridfs/gridstore.js

Module not found: Error: Can't resolve 'fs' in '/home/pavan/Desktop/apstrtcAngular/node_modules/mongo-client/node_modules/mongodb/lib/mongodb/gridfs'

Below is also my package.json file.

{

  "name": "apstrtc-angular",

  "version": "0.0.0",

  "scripts": {

    "ng": "ng",

    "start": "ng serve",

    "build": "ng build",

    "test": "ng test",

    "lint": "ng lint",

    "e2e": "ng e2e"

  },

  "private": true,

  "dependencies": {

    "@angular/animations": "~7.0.0",

    "@angular/common": "~7.0.0",

    "@angular/compiler": "~7.0.0",

    "@angular/core": "~7.0.0",

    "@angular/forms": "~7.0.0",

    "@angular/http": "~7.0.0",

    "@angular/platform-browser": "~7.0.0",

    "@angular/platform-browser-dynamic": "~7.0.0",

    "@angular/router": "~7.0.0",

    "angular2-multiselect-dropdown": "^4.0.0",

    "body-parse": "^0.1.0",

    "bson": "^3.0.2",

    "buffer": "^5.2.1",

    "core-js": "^2.5.4",

    "crypto": "^1.0.1",

    "express": "^4.16.4",

    "fs": "^0.0.1-security",

    "g": "^2.0.1",

    "global": "^4.3.2",

    "mongo-client": "^0.2.1",

    "mongodb": "^3.1.9",

    "mongoose": "^5.3.11",

    "net": "^1.0.2",

    "ng-multiselect-dropdown": "^0.2.3",

    "ng5-slider": "^1.1.4",

    "ngx-pagination": "^3.2.1",

    "router": "^1.3.3",

    "rxjs": "^6.3.3",

    "rxjs-compat": "^6.3.3",

    "stream": "0.0.2",

    "timers": "^0.1.1",

    "tls": "0.0.1",

    "zone.js": "~0.8.26"

  },

  "devDependencies": {

    "@angular-devkit/build-angular": "~0.10.0",

    "@angular/cli": "~5.0.3",

    "@angular/compiler-cli": "~7.0.0",

    "@angular/language-service": "~7.0.0",

    "@types/jasmine": "~2.8.8",

    "@types/jasminewd2": "~2.0.3",

    "@types/node": "^8.9.5",

    "codelyzer": "~4.5.0",

    "jasmine-core": "~2.99.1",

    "jasmine-spec-reporter": "~4.2.1",

    "karma": "~3.0.0",

    "karma-chrome-launcher": "~2.2.0",

    "karma-coverage-istanbul-reporter": "~2.0.1",

    "karma-jasmine": "~1.1.2",

    "karma-jasmine-html-reporter": "^0.2.2",

    "protractor": "~5.4.0",

    "ts-node": "^7.0.1",

    "tslint": "~5.11.0",

    "typescript": "^3.1.6",

    "crypto": "^1.0.1"

  }

}

I was able to connect to mongoDb using a .js file, but I was not able to forward the data from that js file to the component. Since I am very new to angular, I would be glad if there is any other easier way to do it.

I am not sure this is the right answer, but after some research I belive that ServerModules like
MongoDb, mongoose etc should not be imported into the clientSide, Since Angular is completely ClientSide, i think mongoose should not be imported into the component.