ionic-framework 相关问题

ion-back-button 在 Ionic 7 中的 Android 设备上不显示，但可以在浏览器中使用

我想知道为什么离子后退按钮没有显示在 Android 设备上的 Ionic 7 应用程序中，尽管它在浏览器中工作正常。我已经检查了页面、选项卡和路由的结构...

即使设置了baseUrl，也找不到Typescript tsconfig.json“路径”

我有一个 typescript 中的 ionic 7 Vue 项目。我正在尝试使用 tsconfig.json 路径为某些共享接口创建别名，但添加的路径无法解析。这是我的 tsconfig.json： { ...

错误 NG8001：“ion-list”不是已知元素：Ionic v7

以下是我采取的步骤 我使用 ionic start template Blank 创建了 ionic 7 的新项目 将 Angular 更新为 Angular 17.3 创建了一个新的主页页面模块 我正在关注 e...

如何设置ion-option的默认选择值？

我使用的是 Ionic v2，显示页面时无法设置所选值。 我使用的是 Ionic v2，显示页面时无法设置所选值。 <ion-select [(ngModel)]="company.form"> <ion-option *ngFor="let form of forms" [value]="form" [selected]="true">{{form.name}}</ion-option> </ion-select> 我也尝试过使用checked，但这也行不通。我怎样才能做到这一点？ Cordova CLI: 6.4.0 Ionic Framework Version: 2.0.0-rc.3 Ionic CLI Version: 2.1.13 Ionic App Lib Version: 2.1.7 Ionic App Scripts Version: 0.0.45 如果处理默认值异或对象，最干净的方法是为 [compareWith] 属性提供比较函数。该函数在参数中接受 2 个对象，如果它们相等则返回 true。这样，模型中的现有值将在开始时被选择。如果在选择之外的模型中添加新数据，这也适用。 以下示例取自官方 Ionic 文档 <ion-item> <ion-label>Employee</ion-label> <ion-select [(ngModel)]="employee" [compareWith]="compareFn"> <ion-option *ngFor="let employee of employees" [value]="employee"></ion-option> </ion-select> </ion-item> compareFn(e1: Employee, e2: Employee): boolean { return e1 && e2 ? e1.id == e2.id : e1 == e2; } 编辑：使用双等号使其适用于 Ionic 4（正如 Stan Kurdziel 在评论中建议的那样） 问题似乎是 ion-option 不喜欢 rc3 中的对象。我必须仅使用对象的 id 部分，并编写一个单独的更改处理程序来查找所需的对象并将其设置为值。 <ion-select [ngModel]="company.form.id" (ngModelChange)="companyFormSelected($event)" okText="Ok" cancelText="Mégsem"> <ion-option *ngFor="let form of forms" [value]="form.id" [selected]="form.id == company.form.id">{{form.name}}</ion-option> </ion-select> 还有变更处理程序： companyFormSelected(newform) { let selectedForm = this.forms.find((f)=>{ return f.id === newform; }); this.company.form=selectedForm; } 这似乎是 rc3 中的一个错误，但我不知道在哪里可以报告错误。我确实在离子论坛上打开了一个主题。 <ion-select [(ngModel)]="name">// binding the value available from ts file <ion-option *ngFor="let form of forms; let idx = index" [value]="form.name" selected="{{(idx==0).toString()}}">{{form.name}}</ion-option> </ion-select> 在你的 ts 文件中 name = this.forms[0].name //assign the variable name to the first index of your array 这对我有用。 在 HTML 中： <ion-select [(ngModel)]="company.form"> <ion-option value="frm1"> Form 1 </ion-option> <ion-option value="frm2"> Form 2 </ion-option> </ion-select> 在 ts 中： company = { form:null }; constructor(){ this.company.form = "frm1"; } <ion-select ([ngModel])="dropdown1"> <ion-select-option value="1">Item1</ion-select-option> <ion-select-option value="2">Item2</ion-select-option> </ion-select> 以下内容将不起作用： dropdown1 = 2; 但是以下方法会起作用： dropdown1 = 2 + ""; 选择选项值被视为字符串，因此您应该将字符串值分配给模型变量，以便比较不会失败。 您不需要使用选定的属性或[选定]，这是没有必要的 <ion-select [(ngModel)]="company.form.id" name="company.form.id"> <ion-option *ngFor="let form of forms" value="{{ form.id }}"> {{ form.name }} </ion-option> </ion-select> 长话短说，并引用离子文档（始终引用原始来源）： “选择应该与子元素一起使用。如果子元素没有被赋予 value 属性，那么它的 text 将被用作 value。 如果在 上设置了 value，则将根据该 value 选择所选选项。” ...因此...确保您的 ionic-select 和 ionic-select-option 上的 value 属性在代码中引用相同的 javascript object.attribute...基本上指向相同的东西。 .请参阅下面的 ionic-select 和数组级别 value="{{c.id}}" 中的页面级别属性 value="{{country.id }}" 离子选择选项 请注意，ngModel不再管理页面级别country属性生命周期 <ion-item> <ion-select *ngIf="countries.length > 0" (ionChange)="onCountryChaged($event)" interface="popover" clearInput="true" placeholder='Country (required)' value="{{ country.id }}"> <ion-select-option lines="none" *ngFor="let c of countries" value="{{ c.id }}"> {{ c.label }} </ion-select-option> </ion-select> </ion-item> Inside the .ts file we can now set *country* member programmatically Page:constructor(); this.platform.ready().then(async () => { this.getCountries(); //load list of countries from provider this.country = this.navDataService.getCountry();//local data store to save state between pages }).catch(error => { }); Page:EventHandler onCountryChaged(event): void { let id = event.detail.value; this.country = this.countries.find( item => item.id == id ) ; this.navDataService.setCountry(this.country); } 在离子选项内，你可以做 <ion-option [attr.selected]="(form.name == name) ? true : null"> {{ form.name }} </ion-option> in html----> <ion-item text-center > <ion-select [(ngModel)]="selectedQuestion" placeholder="Choose Security Question" > <ion-option *ngFor="let q of questionArray let i=index" selected="{{(i==defaultSelectQuestion).toString()}}" > {{q}} </ion-option> </ion-select> </ion-item> in ts----> //if u dont want any default selection this.defaultSelectQuestion = -1; //if first element should be your default selection this.defaultSelectQuestion = 0; this.selectedQuestion=this.questionArray[this.defaultSelectQuestion] 角度解决方案： html： <form [formGroup]="formName"> <ion-item> <ion-select label="Label" label-placement="floating" formControlName="formControleName" [value]="" > <ion-select-option *ngFor="let value of values" [value]="value"> {{ item}} </ion-select-option> </ion-select> </ion-item> </form> ts： let values = ["value1", "value2", "value3"] let defaultVlaue = "value2" this.formName = new FormGroup( { formControleName: new FormControl(defaultvalue, [Validators.required]) } )

NullInjectorError：没有存储提供者！离子6

尝试在我的离子应用程序中使用存储版本2.1.3，但出现错误： NullInjectorError：R3InjectorError（AppModule）[AppModule - >存储 - >存储 - >存储]：

vue3 和 typescript 可组合项以及返回数组值

使用Vue2很长时间后刚接触Vue3。我有一个返回对象数组的可组合文件。在浏览器开发工具中，我可以看到我的变量加载了正确的数据。然而，任何时候我

JSON 解析问题，检测到意外空白的错误

我有一个如下所示的对象，orderItems 以 string[] 形式存储在 appwriteDB 中（appwrite 仅支持 string[]）。我尝试使用 *ngFor 显示该值，但失败了。我试图转换...

Firebase 电话身份验证（使用离子）中出现“找不到主机名匹配”错误

我正在尝试将“firebase 电话身份验证”与 ionic 结合起来。 但是，卡在一个问题上。 我不断收到“未找到主机名匹配”错误 .catch(函数(错误){ console.log("错误...

Ionic 应用程序在 Android 设备中显示出恶意。风险名称：Android:Evo-gen[Trj]+AG1335518|egap

我们的应用程序处于测试版版本。从 Play 商店下载后，在某些 Android 设备中，速度会变慢，该应用程序是恶意的。请参考图片。在某些设备中它显示警告...

Ionic：npm 测试命令挂在 azure DevOps 管道中

我正在为我的离子项目（桌面、Android 和 iOS）创建一个管道：每个平台的一个作业。 第一份工作如下： 工作： - 工作：Build_Ionic 水池： vmImage: 'macos-最新' 圣...

离子输入形状属性错误？

我正在尝试创建一个带有舍入输入的表单。使用此处的文档，我将“形状”和“填充”放在离子输入上，而不是现在已弃用的离子项目上的用法。然而，离子输入

如何在 Ionic 7 中自定义离子选择的标签？

我正在使用 Ionic 7 和 Angular（材质）14。 我想在适用的字段标签中显示必填字段指示符 (*)。 在 Ionic 6 中，我通过在 ion-... 中添加 span 标签来实现这一点。

离子框架中的月份和年份选择器

我正在为我的离子应用程序寻找月份和年份选择器。目前我正在使用http://ngcordova.com/docs/plugins/datePicker/ 但我不想在这里选择日期选择器。如何只有月和叶...

Swiper - Ionic -Angular：从最后一张幻灯片滚动到第一张幻灯片时索引不会重置

当用户可以滚动选择他的体重时，我使用滑动器创建一个滑动数字数组。 Swiper 有 [loop]="true" 我的问题是，一旦用户达到我的案例幻灯片中的限制...

Swiper 未显示在 ionic Angular 上

Swiper（或只是 ng-template 部分）不会显示在 ionic Angular 上 Ionic Framework 的建议是使用 SwiperJs (https://swiperjs.com/) 而不是 Ion Slider（这将被废弃...

Ionic + Angular + Codeigniter4 生产中出现 CORS 错误

我有以下问题。在我的本地环境中，我可以使用 codeigniter 4 从 ionic + Angular 应用程序向我的 php 后端发出请求，没有任何问题。但是当我部署到我的 Hostinger 服务时...

离子电容器JS中的httpd插件

我们正在开发离子电容器混合移动应用程序。 该项目 ionic cordova 稍后我们将离子电容器项目转换为最新版本 ionic cordova 我们使用了这个插件：https://www.npmjs.com/p...

电容器不适用于 Ionic 和 vanilla JS

当按照文档 https://ionicframework.com/docs/vue/quickstart 创建 Ionic 应用程序并将 typescript 转换为 javascript （此文档页面上有 10 个步骤）时，创建时出现问题

AssertionError ERR_ASSERTION：catch 子句变量不是 Error 实例

所以发生的事情是我无法在我的项目中设置身份验证、firestore 和云存储，它一直显示此错误， [错误]断言错误[ERR_ASSERTION]：catch子句变量不是...

如何更改 ionic 7 中离子输入标签的颜色

我已将项目升级到 Ionic 7，现在离子输入不需要离子标签。我已经改变了它，但我不知道如何分配它们的颜色。 前： 在此输入图像描述 输入图片