如何将数据从角度应用程序组件发送到index.js(节点服务器)

时间:2020-09-20 19:21:34

标签: javascript node.js angular typescript axios

我遇到了很多问题,但我不知道如何向服务器发送变量

我在角度组件 app.component.ts

中有3个变量
import { Component, OnInit } from '@angular/core';
import { DataService } from 'src/app/services/data.service';
import { ChartDataSets, ChartOptions, ChartType } from 'chart.js';
import { Color, Label } from 'ng2-charts';
import {
  HttpHeaders,
  HttpParams,
  HttpClientModule,
  HttpClient,
} from '@angular/common/http';

@Component({
  selector: 'app-linechart',
  templateUrl: './linechart.component.html',
  styleUrls: ['./linechart.component.scss'],
})
export class LinechartComponent implements OnInit {
  public lineChartOptions: ChartOptions = {
    responsive: true,
    maintainAspectRatio: true,
    title: {
      display: true,
      position: 'left',
      text: 'worldwide Covid 19 Case Summary',
    },
    legend: {
      position: 'top',
      align: 'start',
    },
    // We use these empty structures as placeholders for dynamic theming.
    scales: {
      xAxes: [
        {
          ticks: {
            autoSkip: true,
            //max:500
            maxRotation: 0,
            minRotation: 0,
          },
        },
      ],

      yAxes: [{}],
    },
  };
  public lineChartLabels: Label[] = [
    '2006',
    '2007',
    '2008',
    '2009',
    '2010',
    '2011',
    '2012',
  ];

  public lineChartType: ChartType = 'line';

  public lineChartLegend = true;

  public lineChartData: ChartDataSets[] = [
    { data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A' },
    { data: [28, 48, 40, 19, 86, 27, 90], label: 'Series B' },
  ];

  countries: any;
  countryCode: any;
  startDate: any;
  endDate: any;

  constructor(private oip: DataService, private http: HttpClient) {}

  ngOnInit() {
    this.oip.getCountries().subscribe((data) => {
      this.countries = data;
      console.log(this.countries);
    });
  }

  getCoronaDataRange(txtSD: any, txtED: any) {
    this.startDate = txtSD.value;
    this.endDate = txtED.value;
    console.log(this.startDate);
    console.log(this.endDate);


  }

  getCountryCode(countryCode: any) {
    this.countryCode = countryCode;
    console.log(this.countryCode);
  }
}

我想将它们传递到服务器 index.js 的参数内,而不是参数:{ startDate:'2019-01-05', endDate:'2020-09-21', countryCode:“ MY” }

const express = require('express');
const axios = require('axios');
const cors = require('cors');
const app = express();
const http = require('http');
const server = http.createServer(app);
const port = 4600;

var corsOptions = {
    origin: ["http://localhost:4200","http://localhost:4000"]
}

app.use(cors(corsOptions));

app.get('/', (req, res) => {
    res.status(200).send('starting server');
})

app.get('/corona-data', (req, res) => {

    axios({
        method: 'GET',
        baseURL: 'https://api.oip.tmrnd.com.my',
        url: 'app/t/opendata.oip.tm.com.my/coronatracker/1.0.0/country',
        params: {
            startDate:'2019-01-05',
            endDate:'2020-09-21',
            countryCode:'MY'
        },
        headers: {
            Authorization : 'Bearer 0e9ceb08-9a2c-3311-999e-59a2989deb3f'
        }
    }).then((result) => {
        console.log(result.data);
        res.status(200).json(result.data);

    }).catch(error => {
        console.error('Error Has Occured');
        console.log(error);
        res.status(500).json(error.message);
    });
});

// Start the service
server.listen(port, () => {
    console.log('Server is listening to port ' + port);
})

1 个答案:

答案 0 :(得分:0)

要请求API时,请执行以下代码。

const myheader = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded')
    let body = new HttpParams();
    body = body.set('startDate', this.startDate);
    body = body.set('countyCode', this.coutryCode);
    body = body.set('endDate', this.endDate);
    http
      .post('/your-server-api-url', body, {
        headers: myheader),
      })
      .subscribe();
相关问题