无法将数据从角度发布到节点 api

Question

我正在尝试将数据从 Angular 发布到节点 API，但数据未发布

我已经设置了一个节点 API，在 angular 上设计了一个简单的文本框和按钮，当点击时，文本框的值应该被发布到节点 API，数据没有被发布，也没有来自 angular 订阅方法的响应

ins.service.ts

    import { Injectable } from '@angular/core';
    import { Http } from '@angular/http';
    import {Observable,Subject} from 'rxjs';
    @Injectable({
      providedIn: 'root'
    })
    export class InsService {
      name: String;
      constructor(private http:Http) { }
      postAPIData(name: String):Observable<any>{
        console.log("hi");
        return this.http.post('http://localhost:3000/', {"name":name})
      }
    }

ins.component.ts

    import { Component, OnInit } from '@angular/core';
    import {InsService} from '../ins.service'
    @Component({
      selector: 'app-ins',
      templateUrl: './ins.component.html',
      styleUrls: ['./ins.component.css']
    })
    export class InsComponent {
      ivalue:String;
      ins:InsService;
      constructor()
      {

      }

    insoperation(insertion:String)
    {
      if(insertion)
      {
        this.ivalue=insertion;
        console.log(this.ivalue);
        this.postdata();
      }
    }  
    postdata()
    {
        ()=>{this.ins.postAPIData(this.ivalue).subscribe((response)=>{
          console.log('response from post data is ', response);
        })};
    }

    }

server.js

    var express=require("express");
    var app=express();
    var bodyParser = require('body-parser')
    var cors = require("cors");
    app.use(cors());
    app.use(bodyParser.json());
    app.use(bodyParser.urlencoded({ extended: true }));
    app.listen(3000,"localhost",function(req,res,next){
        console.log("Server running on port 3000");
    })
    app.all("/*", function(req, res, next){
      res.header('Access-Control-Allow-Origin', '*');
      res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
      res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
      next();
    });
    app.post('/',function(req,res,next){
    console.log(req.body);
    })

我希望数据从角度发布到节点

Answer 1

inst: InService 行只告诉 TypeScript 变量的类型。您需要在 构造函数 中定义服务才能使用它。

你可以在 postdata() 函数中去掉箭头函数：

inst: InService // Remove this line, instead define it in your constructor

constructor(private ins:InsService  ) {}

postdata(){
    this.ins.postAPIData(this.ivalue).subscribe((response)=>{
          console.log('response from post data is ', response);
    })};
}

Answer 2

在构造函数中定义服务

constructor(private ins:InsService  ) {}

并从

中删除引用

  ins:InsService; // this line

你需要把angular上的postdata方法改成

(()=>{this.ins.postAPIData(this.ivalue).subscribe((response)=>{
      console.log('response from post data is ', response);
    })})();

或

postdata()
{
    this.ins.postAPIData(this.ivalue).subscribe((response)=>{
      console.log('response from post data is ', response);
    });
}

您正在定义一个未执行的箭头函数