无法使用来自客户端

时间:2018-01-22 01:53:57

标签: javascript html angular typescript express

我正在尝试使用客户端的Angular将数据推送到MySQL数据库,并在服务器端表达JS。当我使用Postman测试它时,服务器端的post功能端已经工作了。代码如下所示:

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
  extended: true
}));
app.post('/newPush', function(req, res) {
  var data = JSON.stringify(req.body);
  var dt = JSON.parse(data);
  let sql = 'INSERT INTO results(question1, question2, question3, question4)values("' + dt.question1 + '", "' + dt.question2 + '", "' + dt.question3 + '", "' + dt.question4 + '")';
  let query = db.query(sql, (err, result) => {
    if (err) {
      throw err;
    }
    console.log(result);

    res.send(JSON.stringify(req.body) + 'success');
  })
})

我已经尝试使用邮递员发布一些数据,但它确实有用。我使用邮递员发布的帖子成功发布到MySQL数据库。然后我尝试使用Angular Typescript从客户端发布数据,但看起来我做错了。数据根本不会出现在我的数据库中。我还没弄清楚是什么让它无效。以下是使用Angular在客户端看起来的代码:

//component.ts

newForm: FormGroup;

constructor(private http: Http, public builder: FormBuilder) {
  this.newForm = this.builder.group({
    question1: [null],
    question2: [null],
    question3: [null],
    question4: [null],
  });
}

pushNewResults() {
  console.log('1', this.newForm.controls.question1.value);
  console.log('2', this.newForm.controls.question2.value);
  console.log('3', this.newForm.controls.question3.value);
  console.log('4', this.newForm.controls.question4.value);

  return this.http.post(
    'http://localhost:8000/newPush', {
      question1: this.newForm.controls.question1.value,
      question2: this.newForm.controls.question2.value,
      question3: this.newForm.controls.question3.value,
      question4: this.newForm.controls.question4.value
    });
}
<div *ngIf="isVerified" align="left" class="container">
  <form [formGroup]="newForm">
    <div *ngFor="let items of jsonData">
      <div *ngFor="let items2 of items.question">
        <label>{{items2.questionid}}. {{items2.questiondesc}}</label>
        <div *ngFor="let items3 of items2.alloptions; let idx=index">
          <div class="radio">
            <input type="radio" name="question{{items2.questionid}}" [value]="items3.answer" formControlName="question{{items2.questionid}}"><b>{{items3.options}}</b>. {{items3.answer}}
          </div>
        </div><br>
      </div>
    </div>
    <div align="center">
      <button type="submit" class="btn btn-sm btn-success" (click)="pushNewResults(newForm)">SUBMIT</button>
    </div>
  </form>
</div>

question1question2question3question4的值在提交时使用console.log,但未进入MySQL数据库。有人能帮帮我搞清楚吗?请让我知道需要更多的片段。

1 个答案:

答案 0 :(得分:0)

@CozyAzure在评论部分回答,我只需要在subscribe()之后添加http.post()