Ionic “ngModel”无法绑定到“ion-input”

pgx2nnw8 于 2023-04-03 发布在 Ionic

关注(0)|答案(2)|浏览(192)

我正在使用ionic 7与angular来构建社交应用程序，我想使用双向绑定来从输入字段获取数据，但ngModel无法识别。

<div class="post-input">
<ion-item>
  <ion-input
    placeholder="Write your today's post ..."
    [(ngModel)]="postText"
    [ngModelOptions]="{standalone: true}"
  ></ion-input>
</ion-item>
<ion-button class="post-btn" color="medium" (click)="post()">
  <ion-icon name="pencil-outline"></ion-icon>
</ion-button>

TS文件：

import { Component } from '@angular/core';
import { IonicModule } from '@ionic/angular';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
  standalone: true,
  imports: [IonicModule],
})
export class HomePage {

  postText!: string
  constructor() {}

  post() {

  }
}

现在我得到错误Can 't bind to 'ngModelOptions'，因为它不是'ion-input'的已知属性，并且旧的解决方案不起作用。

ionic-framework

来源：https://stackoverflow.com/questions/75895372/ngmodel-cannot-be-binded-to-ion-input

2条答案

按热度按时间

9udxz4iz1#

模板驱动表单的输入（如ngModel和ngModelOptions）仅在将FormsModule导入独立功能组件（或功能模块）时可用：

import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
  standalone: true,
  imports: [IonicModule, FormsModule],
})

在独立的根组件（或根模块）中导入FormsModule是不够的。
有关详细信息，请参阅Angular guide on building a template-driven form。

赞(0）回复(0）举报 2023-04-03

ztigrdn82#

确保您已经在app.module.ts文件中导入了FormsModule。

import { FormsModule } from '@angular/forms';
@NgModule({
  imports: [
    FormsModule
  ]
})

如果您仍然有问题，请确保您已经在app.module.ts文件中导入了“Ionicmodule”和“Commonmodule”。

import { IonicModule } from '@ionic/angular';
import { CommonModule } from '@angular/common';

@NgModule({
   imports: [
    IonicModule,
    CommonModule,
    FormsModule       
   ],  
})

赞(0）回复(0）举报 2023-04-03

我来回答

Ionic “ngModel”无法绑定到“ion-input”

2条答案

相关问题

热门标签

最新问答