从离子中提交数组时无法读取未定义的属性“值”

Question

我有一个正在以离子形式开发的投票结果收集器表格

我的数据库结构就是这种方式

如果您查看桌上的电话号码 08033918581 ，他能够一次将三个结果插入数据库。在php中执行此操作没有什么压力，但是我尝试使用与HTML中相同的方法在 ionic 中实现相同的目标，但是不能。

以下是我的result.html离子文本

<ion-item class="mylist hideme">
<ion-input type="text"  *ngFor="let post of postList" value="{{post.phoneNo}}" placeholder="Phone" name="phones" #phones></ion-input>
</ion-item>

<ion-item class="mylist chat-item item-remove-animate item-avatar item-icon-right list card animated fadeInUp">
<ion-input type="text" readonly  name="party[]" placeholder="APC"  value="apc"></ion-input>
<ion-input type="number" placeholder="Total Votes" name="vote[]" #vote></ion-input>

</ion-item>

<ion-item class="mylist chat-item item-remove-animate item-avatar item-icon-right list card animated fadeInUp">
<ion-input type="text" readonly name="party[]"  value="pdp"></ion-input>
<ion-input type="number" placeholder="Total Votes" name="vote[]" #vote></ion-input>
</ion-item>

<ion-item class="mylist chat-item item-remove-animate item-avatar item-icon-right list card animated fadeInUp">
<ion-input type="text" readonly  name="party[]"  value="apga"></ion-input>  
<ion-input type="number" placeholder="Total Votes" name="vote[]" #vote></ion-input>
</ion-item>    

<ion-item class="mylist chat-item item-remove-animate item-avatar item-icon-right list card animated fadeInUp">
<ion-input type="text" readonly   name="party[]"  value="lp"></ion-input>
<ion-input type="number" placeholder="Total Votes" name="vote[]" #vote></ion-input>

</ion-item>

<ion-item class="mylist chat-item item-remove-animate item-avatar item-icon-right list card animated fadeInUp">
<ion-input type="text" readonly   name="party[]"  value="ivc"></ion-input> 
<ion-input type="number" placeholder="Invalid vote cast" name="vote[]" #vote></ion-input>

</ion-item>

<ion-item class="mylist chat-item item-remove-animate item-avatar item-icon-right list card animated fadeInUp">
<ion-input type="text" readonly  readonly  name="party[]"  value="tvc"></ion-input>
<ion-input type="number"  placeholder="Total vote cast" name="vote[]" #vote></ion-input>

</ion-item>
<div class="padding">
<button ion-button  round   small (click)="submit()" class="btns ink fadeInUp">Add Result</button>
</div>

在我的.ts中，我有这个

@ViewChild("party")party;
@ViewChild("vote")vote; 
@ViewChild("phones")phones; 

对于发送功能

submit(){

  //// check to confirm the username, email, telephone and password fields are filled


  if(this.vote.value==""){

  let alert = this.alertCtrl.create({

  title:"ATTENTION",

  subTitle:"Total vote cast is required. Enter 0 where not available.",

  buttons: ['OK']

  });

  alert.present();

  }

  else

  {

  var headers = new Headers();

  headers.append("Accept", 'application/json');

  headers.append('Content-Type', 'application/json' );

  let options = new RequestOptions({ headers: headers });

  let data = {

    party: this.party.value,
    vote:   this.vote.value, 
    phone:   this.phones.value

  };

  let loader = this.loading.create({

  content: 'Submitting, please wait…',

  });

  loader.present().then(() => {

  this.http.post('http://edomonitor.com/electionApi/addResult.php',data, options)

  .map(res => res.json())

  .subscribe(res => {

  loader.dismiss()

  if(res=="RESULT SUCCESSFULLY ENTERED"){

  let alert = this.alertCtrl.create({

  //title:"CONGRATS",

  subTitle:(res),

  buttons: ['OK']

  });

  alert.present();

  this.navCtrl.push(PostPage);

  }else if(res=="YOU ARE NOT AUTHORISE TO SEND RESULT MORE THAN ONCE"){

    let alert = this.alertCtrl.create({

      //title:"ERROR",

      subTitle:(res),

      buttons: ['OK']

      });

      alert.present();

    }else

  {

  let alert = this.alertCtrl.create({

  //title:"ERROR",

  subTitle:(res),

  buttons: ['OK']

  });

  alert.present();

  }

  });

  });

  }

  }

为澄清起见： 表单的输入名称party []已经定义，但是在表决输入中，类别表决的名称为vote []。

我正在尝试找到一种方法来获取表单中每一方的投票并将其发送到服务器。

我在做什么错了？