ionic-framework 相关问题

任务：app：checkDebugAarMetadata 失败 BUG？

我猜我遇到了这个问题或错误，我花了几天时间试图解决这个问题，但我没有选择。 我正在尝试在真实设备上构建和调试我的应用程序。我已经尝试过扩展，

“http://localhost:8100”已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头

`从源“http://localhost:8100”访问“http://localhost/phpfile/leave-option.php”处的 XMLHttpRequest 已被 CORS 策略阻止：无“Access-Control-Allow-Origin” ' 标头出现在

如何使用 RXJS 5.5.2 更新更好地捕获/执行/清空

正如 ionic-Angular 3.9.0 发行说明 (https://github.com/ionic-team/ionic/blob/master/CHANGELOG.md) 中所述，利用更新到 RXJS 5.5.2 的优势可以减小捆绑包尺寸并

按下离子选择选项时如何应用过滤器

您好，在我的 Ionic 5 Angular 14 项目中，我想使用 ion-select 来过滤对象数组。 Ionic 使用“确定”和“取消”按钮来应用过滤器，但我不希望这样。我希望当用户点击...

@angular/google-maps 上有关于新 google.maps.marker.AdvancedMarkerElement 的任何新更新吗？

我无法根据新更新 google.maps.marker.AdvancedMarkerElement 导入任何组件以进行标记的新更新。无法在我的角度应用程序中使用组件。它说它不是一个已知的元素...

如何在 Testflight 上启用 Firebase Analytics 调试视图

通过 TestFlight 将应用程序安装到测试手机后，我无法查看分析调试视图。 我已传入参数 -FIRDebugEnabled，并尝试过 -FIRAnalyticsDebugEnabled 但没有...

当键盘出现在离子+电容器应用程序中时，如何让输入顺利地重新定位

我正在开发一个包含聊天功能的 Ionic 应用程序。很早就，我遇到了一些让我质疑我所选择的技术的事情。 与大多数聊天应用程序一样，我在底部有一个文本输入...

http 请求的离子电容器策略

我有一个带有 Capacitor 3、Ionic 5 和 Angular 的应用程序。 由于服务器中的 CORS 问题，我正在使用 Capacitor Http 插件来处理所有请求。 应用程序向服务器发出 http 请求...

错误类型错误：google.maps.Travelmode 未定义，即使已定义

我试图在我的项目中包含谷歌地图，尽管一切都应该是正确的，但我遇到了上面的错误。 如果我只是搜索一个位置，我就会到达那里，一切正常，但是......

Xcode15 - IOS17：命令 PhaseScriptExecution 失败，退出代码非零

我最近将我的开发环境升级到以下规格： Xcode 版本：15.2 (15C500b) iOS 版本：17.2 我的项目是使用 Ionic 构建的，我当前的环境版本...

离子按钮如何向屏幕阅读器宣布？

目前，在使用 Cypress 编写端到端测试时，使用测试库，我注意到应用程序中通过 ionic 的 ion-button 呈现的一些按钮在按钮角色下找不到。

离子图标在 ionic 7.1.1 / Angular: 17.0.8

我正在使用 Angular 独立组件，ionic 版本是 7.1.1 / Angular 版本：17.0.8。 这是 HTML： {{姓名}} 我正在使用 Angular 独立组件，ionic 版本是 7.1.1 / Angular 版本：17.0.8。 这是 html: <div id="container"> <strong>{{ name }}</strong> <div class="icon-container"> <p>Windows Shop</p> <div class="win-icon"> <ion-icon name="logo-windows"></ion-icon> </div> </div> </div> 这是 ts 类： import { Component, Input } from '@angular/core'; import { IonIcon } from '@ionic/angular/standalone'; import { CommonModule } from '@angular/common'; import {logoWindows} from 'ionicons/icons'; @Component({ selector: 'app-explore-container', templateUrl: './explore-container.component.html', styleUrls: ['./explore-container.component.scss'], imports: [IonIcon], standalone: true, }) export class ExploreContainerComponent { @Input() name?: string; constructor(){ addIcons:{{logoWindows}} } } 如上所述，离子图标未显示，这是浏览器控制台中的错误： index.js:32 Uncaught TypeError: Failed to construct 'URL': Invalid base URL at getAssetPath (index.js:32:22) at getNamedUrl (icon.js:46:22) at getUrl (icon.js:27:12) at Icon.loadIcon (icon.js:296:25) at icon.js:257:18 at Icon.waitUntilVisible (icon.js:291:13) at Icon.connectedCallback (icon.js:255:14) at Icon.connectedCallback (index.js:3390:43) at DefaultDomRenderer2.insertBefore (platform-browser.mjs:563:26) at nativeInsertBefore (core.mjs:8495:14) index.js:32 Uncaught TypeError: Failed to construct 'URL': Invalid base URL at getAssetPath (index.js:32:22) at getNamedUrl (icon.js:46:22) at getUrl (icon.js:27:12) at Icon.loadIcon (icon.js:296:25) at icon.js:257:18 at Icon.waitUntilVisible (icon.js:291:13) at Icon.connectedCallback (icon.js:255:14) at Icon.connectedCallback (index.js:3390:43) at StackController.transition (ionic-angular-common.mjs:1351:29) at ionic-angular-common.mjs:1242:29 src_app_tab1_tab1_page_ts.js:2 TypeError: Failed to construct 'URL': Invalid base URL at getAssetPath (index.js:32:22) at getNamedUrl (icon.js:46:22) at getUrl (icon.js:27:12) at Icon.loadIcon (icon.js:296:25) at Icon.componentDidLoad (icon.js:268:18) at safeCall (index.js:2389:36) at postUpdateComponent (index.js:2299:13) at index.js:2207:9 at Generator.next (<anonymous>) at asyncGeneratorStep (asyncToGenerator.js:3:1) undefined  顺便说一下，我尝试使用以下命令安装最新的 ionic 版本： npm install -g @ionic/cli@latest 但它保留了当前版本：7.1.1 你有什么建议？ 要使用离子图标，您必须单独导入它们： 例如： import { IonIcon } from '@ionic/angular/standalone'; import { addIcons } from 'ionicons'; // Import this import { cameraOutline } from 'ionicons/icons'; @Component({ selector: 'app-youcomponent', templateUrl: 'youcomponent.component.html', styleUrls: ['youcomponent.component.scss'], standalone: true, imports: [ IonIcon ] }) export class Youcomponent { constructor(){ addIcons({ cameraOutline }); // you are missing addIcons Import } } 您需要添加所有图标，例如： app.component.html <ion-icon name="add"></ion-icon> app.component.ts import { Component } from '@angular/core'; import { IonHeader, IonToolbar, IonTitle, IonContent, IonIcon } from '@ionic/angular/standalone'; import {addIcons} from 'ionicons'; import {add} from 'ionicons/icons'; @Component({ selector: 'app-root', templateUrl: 'app.component.html', standalone: true, imports: [IonHeader, IonToolbar, IonTitle, IonContent, IonIcon], })`enter code here` export class AppComponent { constructor() {addIcons({add});} <--this need write all icons what you need } 我在 Angular 17、Ionic 7 和独立版上也遇到了同样的问题。 尽管使用了 Ionic 框架，但图标没有显示。 我使用了 Юлія Гороховацька 的解决方案（非常感谢 Julia），它工作正常，但如果您的导入中已经有 IonicModule，则不需要在那里添加 IonIcon。 如果这样做，您将在控制台中收到错误：错误错误：NG0300：多个组件与标记名离子图标匹配节点：IonIcon 和 IonIcon。 （也可能在您的 IDE 中）。 import {addIcons} from 'ionicons'; import {removeCircle} from 'ionicons/icons'; @Component({ selector: 'app-thingy', templateUrl: './thingy.page.html', styleUrls: ['./thingy.page.scss'], standalone: true, imports: [IonicModule] }) export class ProductsPage implements OnInit { constructor() { addIcons({removeCircle}); // I needed the remove-circle icon, // please note that this uses string literals so rmeove the dash and capitalize the next letter } 我添加这个答案，以防像我这样的另一个初学者发现这个，节省几分钟。 我会发表评论而不是添加答案，但我没有足够的积分来这样做。 ^^'

ionic 有时不显示列表项

我在使用 Meteor + Angular + ionic 构建的移动应用程序时遇到了一个奇怪的问题。 在其中一个选项卡上，我订阅了名为“联系人”的集合，并以 ioni 形式显示联系人列表...

内容安全策略：“img-src'self'数据：”

我有一个应用程序，用户可以在其中复制图像 URL，将其粘贴到输入中，然后图像将加载到框中。 但我的应用程序不断触发此消息： 拒绝加载即时通讯...

Ionic 4 分页

我有简单的提供程序，它从 API url 获取数据，我需要帮助来分页这些数据并通过 IonInfiniteScroll 加载它。 提供者 从 '@angular/core' 导入 { Injectable } ； 导入 { HttpClient,

如何将我的 postgresDB 连接到 Ionic？

如何将我的 postgresDB 连接到 Ionic？？？我已经被困在这个问题上有一段时间了。我尝试查看文档、视频或教程，但找不到我要找的内容。 当开始新离子时...

离子角度 - 如何修改离子选择内的警报？

我怎样才能实现这种选择有没有办法修改所选项目？ 这 离子选择 离子新手我知道自定义属性，但它们都没有按预期工作 尝试了假选择

Ionic 7 如何更改离子复选框的复选框和标签之间的间距？

如何更改 Ionic7 中离子复选框中复选框本身与其旁边的文本标签之间的空间/边距/填充？ 维萨奥尔德<...

在 IOS 应用程序中从设备本地加载 HTML、JS、CSS 包无法正常工作

如何通过单击按钮将使用 Ionic 开发的移动网站加载到现有的 iOS 应用程序中？我遇到了一个问题，即 WebView 无法与本地存储的文件正常运行...

如何使用 Java 中的 Selenium WebDriver 在动态生成的 HTML 代码中通过定位器（ID、名称、XPath 或 CSS）来定位元素？

“这是我的角度代码： “这是我的角度代码： <ion-button slot="end" *ngIf="auditData.id == null" (click)="presentActionSheet(section.sectionId)" id="secMedia{{i+section.sectionId}}"> <ion-icon slot="icon-only" name="attach-outline" style="color:black;font-size: 200%;"></ion-icon> </ion-button> 当我单击离子按钮时，它会调用 Ionic Angular TypeScript 中的 presentActionSheet(section.sectionId) 函数。 async presentActionSheet(sectionId: number) { const actionSheet = await this.actionSheetCtrl.create({ header: 'Choose the type of media to be uploaded', buttons: [ { text: 'Image', icon: 'camera', handler: () => { this.clickImage(sectionId); } }, { text: 'Video', icon: 'videocam', handler: () => { this.recordVideo(sectionId); } }, { text: 'Files', icon: 'document', handler: () => { this.userInputElement.click(); this.currentSecId = sectionId; } }, { text: 'Cancel', role: 'cancel', data: { action: 'cancel', }, }, ], }); await actionSheet.present(); } 此时，它会生成动态HTML代码，例如图像的HTML代码： <button type="button" class="action-sheet-button ion-activatable ion-focusable sc-ion-action-sheet-md"> <span class="action-sheet-button-inner sc-ion-action-sheet-md"> <ion-icon aria-hidden="true" class="action-sheet-icon sc-ion-action-sheet-md md hydrated" role="img"> </ion-icon>Image </span> <ion-ripple-effect class="sc-ion-action-sheet-md md hydrated" role="presentation"> </ion-ripple-effect> </button> 那么，如何在 Java 中使用 Selenium WebDriver 编写脚本来单击图像、视频或文件？怎么定位？” 我尝试使用从 UI 复制的 XPath 来查找元素，但似乎找不到该元素。相反，我遇到了错误。 这取决于您的应用程序的行为。 对于动态元素，我们首先检查的是模式。 哪些属性值保持不变？ //button[@class='action-sheet-button ion-activatable ion-focusable sc-ion-action-sheet-md'] 如果不是整个属性值，那么属性的哪一部分保持不变？ //button[contains(@class='action-sheet-button')] 如果您想单击元素按钮内的图像： //button[contains(@class='action-sheet-button')]//*[@role='img'] 如果您想仅使用一个动态 Xpath 单击元素： 'When declaring dynamic element By dynamicBtnClassRole = By.xpath("//button[contains(@class='%s')]//*[@role='%s']"); 'Then when you find for an element WebElement elmButton = driver.findElement(dynamicBtnClassRole.asBy(strClass, strRole); elmButton.click(); 答案取决于您想要实现的目标