将表单输入传递给api url angular

Question

我正在尝试将数据从输入字段传递到api url但似乎我没有正确地执行它。它将输入传递给api减去表单输入。如何正确地将输入传递给api？这是我的代码：

零件：

export class AppComponent {
 constructor(private http: Http) { }
age = ''
phone = ''
sex = ''
number = ''
amount = ''
email = ''
names = ''
  sendDetails(){
    this.http.get('http://example.api.com/step1.php?'+'age=this.age&phone=this.phone&sex=this.sex&number=this.number&amount=this.amount&email=this.email&names=this.names')
    .subscribe(value => {
      const submit = value
      console.log(submit);

    })

  }
}

HTML

<input type="text" [(ngModel)]=age >
<input type="text" [(ngModel)]=phone >
<input type="text" [(ngModel)]=sex >
<input type="text" [(ngModel)]=number >
<input type="text" [(ngModel)]=amount >
<input type="text" [(ngModel)]=email >
<input type="text" [(ngModel)]=names >
<button (click)=sendDetails()> submit</button>

Answer 1

您正在传递字符串'this.name'等...如果您的API正常，那么您需要编写+this.yourParameter+ IE：

this.http.get('http://example.api.com/step1.php?age='+this.age+'&phone='+this.phone+'&sex='+this.sex+'&number='+this.number+'&amount='+this.amount+'&email='+this.email+'&names='+this.names)

Answer 2

交换：

'http://example.api.com/step1.php?'+'age=this.age&phone=this.phone&sex=this.sex&number=this.number&amount=this.amount&email=this.email&names=this.names'

对于：

`http://example.api.com/step1.php?age=${this.age}&phone=${this.phone}&sex=${this.sex}&number=${this.number}&amount={this.amount}&email=${this.email}&names=${this.names}`

这是TypeScript的字符串插值，当您需要连接值时，它非常干净且易于使用。