当我在 MEAN STACK 中提交表单时没有任何反应

Question

原来项目这么简单。用户输入有关一本书的一些信息并单击提交以将信息保存在数据库中 (Mongodb) 我正在使用 MEAN STACK 并且我是一个菜鸟（很明显）。当我提交错误时什么也没有发生。

后端代码：

    //POST ONE BOOK
    booksRoute.route('/post').post((req,res,next)=>{
        var x = {
            name   : req.params.name,
            genre  : req.params.genre,   
            author : req.params.author,
            rating : req.params.rating,
            price  : req.params.price
        }
        console.log(x) ; 
        BookModel(x).save((err,data)=>{
            if (err){console.log(err);}
            else res.send(data) ;
}) ;
})

添加书籍组件html :

<ul>
    <form #f="ngForm" (ngSubmit)="onSubmit(f)">  
    <li>
    <label>book's name *</label>
    <input name="name" type="text" ngModel>
    </li>
    <li>
    <label>book's genre *</label>
    <input name="genre" type="text" ngModel>
    </li>
    <li>
    <label>book's author *</label>
    <input name="author" type="text" ngModel>
    </li>
    <li>
    <label>rating *</label>
    <input name="rating" type="number" [max]="10" min="0" ngModel>
    </li>
    <li>
    <label>price *</label>
    <input name="price" type="number" ngModel>
    <input class="btn btn-primary" type="submit"/> 
    </li>  
</form>
</ul>

angular 服务

  postBook(data){
    console.log(data) ;
    return this.http.post(this.backendUrl+'/post',data) ;
  }

在addBook组件中ts

onSubmit(f){
    //console.log(f.value) ;
    this.apiService.postBook(f.value) ; 
  }

注意 : 我可以从数据库中获取数据，我可以通过书名找到一本书，但我不能 post

Answer 1

我猜你需要订阅你的API/back的回复，像这样：

onSubmit(f){
    //console.log(f.value) ;
    this.apiService.postBook(f.value)
    .subscribe( res => {
     console.log('The back response:', res);
    }); 
}

除非您不订阅具有 http 调用 到 API 的可观察对象，否则不会“启动”http 调用过程。

当我在 MEAN STACK 中提交表单时没有任何反应

nothing happens when i submit a form in MEAN STACK

node.js

angular

mongodb

express

mean-stack