在Angular 4中使用mongodb缝合库

我一直在尝试MongoDB Stitch服务，到目前为止，我能够使用该服务。但是，连接到该服务的唯一方法是在html页面上包含AWS中托管的js库

有一个mongodb stitch npm包可用，mongodb教程中有关于如何使用它的示例页面。但这是一个纯JS库（不支持TS），我尝试了几种方法（使用require、安装lib的typings（不可用）、使用@types）都没用

---

有人在Ng4上试过这个吗？希望您能使用“mongodb stitch”软件包创建服务。

考虑到两个月前提出的问题，不确定该问题是否仍然相关，但无论如何

正如你指出的，你可以使用

npm安装--保存mongodb stitch

由于没有TS绑定，您可以将stitch库声明为any

例如：

    declare var stitch: any;

    export class MyService implements OnInit {
    db;

    client;

    ngOnInit() {
        this.client = new stitch.StitchClient('<check the stitch app page for proper value>');
        this.db = this.client.service('mongodb', 'mongodb-atlas').db('<the db name goes here>');
        this.client.login();
    }

    save() {
        this.db.collection('<collection name>').insertOne({key : 'value'}).then(() => console.log("All done"));
    }

  }

声明变量：任意；
导出类MyService实现OnInit{
分贝；
客户
恩戈尼尼特（）{
this.client=new stitch.StitchClient（“”）；
this.db=this.client.service（'mongodb'，'mongodb-atlas'）.db（''；
this.client.login（）；
}
保存（）{
这个.db.collection（“”）.insertOne（{key:'value'}）。然后（（）=>console.log（“全部完成”）；
}
}

另一个答案建议实例化一个新的

StitchClient

实例，这是MongoDB明确反对的，因为有一个工厂方法可用于此目的。因此，（在安装了

mongodb stitch

）之后，下面的代码将帮助您开始

component.ts

import { Component, OnInit } from "@angular/core";
import { StitchClientFactory } from "mongodb-stitch";

let appId = 'authapp-****';

@Component({
selector: "app-mongo-auth",
templateUrl: "./mongo-auth.component.html",
styleUrls: ["./mongo-auth.component.css"]
})

export class MongoAuthComponent implements OnInit {

mClient;

ngOnInit() {
  this.mClient = StitchClientFactory.create(appId);
}

然后，您可以将其用于您想要的任何目的，例如使用Google实现登录

gLogin(){
this.mClient.then(stitchClient => {
  stitchClient.authenticate("google");
})

---

前面的答案是功能性的，但我想分享一个使用可注入服务的示例

服务台

import { Injectable }    from '@angular/core';
import { Jsonp, URLSearchParams } from '@angular/http';

import { StitchClientFactory } from "mongodb-stitch";

import 'rxjs/add/operator/map';
@Injectable()
export class Service {  
  constructor(private jsonp: Jsonp) { }    
  client;
  connect(){
    this.client = new StitchClientFactory.create("App ID");  // Slitch apps > Clients > App ID
    this.client.then(stitchClient => stitchClient.login())
      .then((stitchClient) => console.log('logged in as: ' + stitchClient))
      .catch(e => console.log('error: ', e));
  }
  all() {
    this.connect();     
    return this.client.then(stitchClient => {
      let db = stitchClient.service('mongodb', 'mongodb-atlas').db("database Name"); // Slitch apps > mongodb-atlas > Name database.Collection
      let itemsCollection = db.collection('name collection'); // Slitch apps > mongodb-atlas > Name database.Collection        
      console.log(itemsCollection.find().execute());
      return itemsCollection.find().execute();                  
    })
     .then(result => {return result})
     .catch(e => console.log('error: ', e));          
   }
 }

创建上一个文件后，必须创建一个模块来接收数据，因此：

模块1.ts

import { Component, OnInit, Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { StitchClientFactory } from "mongodb-stitch";
import { Service }          from 'service'; // previous code

declare var stitch: any;

@Component({  
  template: '
    <ul class="demo-list-icon mdl-list">
      <li class="mdl-list__item" *ngFor="let item of data | async">
         <span class="mdl-list__item-primary-content">
           <i class="material-icons mdl-list__item-icon">{{propiedad.nombre}}</i>            
         </span>
      </li>
   </ul>
  '  
 })
 export class MainComponent implements OnInit {  
   data: Observable<[]>;
   constructor(private Service: service) {
   }
   ngOnInit() {     
     this.propiedades = this.Service.all();
   }  
}

从'@angular/core'导入{Component，OnInit，Injectable}；
从“rxjs/Observable”导入{Observable}；
从“mongodb stitch”导入{StitchClientFactory}；
从“服务”导入{Service}；//先前代码
声明：任何；
@组件（{
模板：'


{{propiedad.nombre}


'  
})
导出类MainComponent实现OnInit{
数据：可观察；
构造函数（专用服务：服务）{
}
ngOnInit（）{
this.propiedades=this.Service.all（）；
}  
}

重要的是，您不必忘记在module.ts初始声明中添加服务

---

当然

网络上有没有什么例子编码？导入，app.module.ts？对于我使用的Stitch API。其他一切都是棱角分明的。没有什么特别的。如前所述-没有TypeScript绑定，因此您可以：

声明var stitch:any

，以便到目前为止能够使用stitchHanks！恐怕我还有一个问题要问。mongodb stitch是否可以使用Promissions与Angulars Obervables结合使用，或者我将如何听取集合中的结果，例如，.find（）？