离子文本区Ionic 4中的设置值

时间:2019-06-11 21:34:05

标签: html angular ionic-framework textarea ionic4

我尝试使用ion-textarea而不是ion-input创建表格来修改我的物品。我无法使用ngmodel或我的打字稿代码中的值设置值。

我尝试(textNote是我的ts中的变量):

 ngmodel="textNote" => X
 ngmodel="textNote" value="textNote" => X
 ngmodel="textNote" value="{{textNote}}" => X

这种组合永远行不通

这是我的html

<ion-header>
  <ion-toolbar color="primary">
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-title>
      <h6>
        Modify Audio Text
      </h6>
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>

  <ion-item>
    <ion-label color="primary" >Hour</ion-label>
    <ion-datetime display-format="HH:mm" [(ngModel)]="hour"></ion-datetime>
  </ion-item>

  <ion-item>
    <ion-label color="primary">Date</ion-label>
    <ion-datetime display-format="DD MMM YYYY" [(ngModel)]="date"></ion-datetime>
  </ion-item>

  <ion-item>
    <ion-label color="primary" position="stacked">Text</ion-label>
    <ion-textarea  type="text"  [(ngModel)]="textNote"></ion-textarea>
  </ion-item>

  <ion-button expand="block" shape="round" (click)="modifyElement()">Modify</ion-button>

</ion-content>

这是我的打字稿

import { DatabaseService } from './../services/database.service';
import { ActivatedRoute, Router } from '@angular/router';
import { Component } from '@angular/core';

@Component({
  selector: 'app-note-text-modify',
  templateUrl: './note-text-modify.page.html',
  styleUrls: ['./note-text-modify.page.scss'],
})
export class NoteTextModifyPage{
  date: String;
  hour: String;  
  id:Number;
  textNote: String = "";

  constructor(private route:ActivatedRoute,private router:Router,private db:DatabaseService) { 
    this.id = +(this.route.snapshot.paramMap.get('id'));

    this.db.getNote(this.id).then(res=>{
      this.date=res.date;
      this.hour=res.hour;
    });
  }

  modifyElement(){
    this.db.updateNoteTimeText(this.id,this.date,this.hour,this.textNote)
    .then(_=>this.router.navigateByUrl('/tabs/note'));
  }

}

0 个答案:

没有答案