离子至上不结合ngmodel

Question

大家好，这个东西使我发疯。

我有此代码：

<form (ngSubmit)="search()" #rosterSearchForm="ngForm">
  <ion-row>
    <ion-col>
      <ion-list inset>
        <ion-item>
          <ion-datetime type="text" placeholder="Year" displayFormat="YYYY" name="year" [(ngModel)]="data.rq.Year" required></ion-datetime>
        </ion-item>
        <ion-item>
          <ion-datetime type="text" placeholder="Month" displayFormat="MM" name="month" [(ngModel)]="data.rq.Month" required></ion-datetime>
        </ion-item>
      </ion-list>
    </ion-col>
  </ion-row> 
  <ion-row>
    <ion-col class="signup-col">
      <button ion-button class="submit-btn" full type="submit" [disabled]="!rosterSearchForm.form.valid" >Search</button>
    </ion-col>
  </ion-row>
</form>

第一个日期选择器与ngmodel进行绑定。第二个没有。我需要单独获取本年份和月份（例如" 2017"one_answers" 11"）。验证始终也会失败，提交按钮永远不会活动。

似乎很简单。但是我看不到错误。我要疯了。请帮助我。

Answer 1

我最终这样做：

<ion-label stacked>Month</ion-label>
<ion-datetime placeholder="Month"
              pickerFormat="MMM YYYY" 
              displayFormat="MMM YYYY"
              [(ngModel)]="month">
</ion-datetime>

和.ts文件

this.Year = this.datepipe.transform(this.month,'yyyy')
this.Month = this.datepipe.transform(this.month,'MM')

Answer 2

您无法使用ion-datetime进行操作，因为它不支持。您可以使用以下代码：

    <ion-row>
      <ion-col>
        <ion-list inset>
          <ion-item>
            <ion-datetime type="text"
                          placeholder="Select Month And year"
                          displayFormat="MM/YYYY"
                          pickerFormat="MM YYYY"
                          name="month"
                          [(ngModel)]="rosterSearchForm.month" required>
            </ion-datetime>
          </ion-item>
        </ion-list>
      </ion-col>
    </ion-row>
    <ion-row>
      <ion-col class="signup-col">
        <button ion-button class="submit-btn" full type="submit"
                [disabled]="!rosterSearchForm.form.valid" >Search</button>
      </ion-col>
    </ion-row>
  </form>

和.ts

  search(rosterSearchForm){
    console.log(rosterSearchForm.value);
  }