标签: ionic4

你如何在 Ionic 4 中设置背景图像？我尝试了几种方法都无济于事。

我正在关注本教程：https : //javebratt.com/ionic-firebase-tutorial-auth/

我也试过

--background: #fff url('../../assets/images/cover.jpg') 无重复中心/封面；}

任何帮助将不胜感激。我正在使用离子 4

ion-content {
  .background{
        background-image: url('../../../assets/img/login-image.jpg');
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
  }
form {
  margin-bottom: 32px;
  button {
    margin-top: 20px !important;
  }
}

p {
  font-size: 0.8em;
  color: #d2d2d2;
}

ion-label {
  margin-left: 5px;
}

ion-input {
  padding: 5px;
}

.invalid {
  border-bottom: 1px solid #ff6153;
}

.error-message {
  min-height: 2.2rem;
  ion-label {
    margin: 2px 0;
  }
}
}

<ion-content class="background">
<form [formGroup]="loginForm">
  <ion-item>
    <ion-label …

我正在使用带有许多应用程序的 ionic 3 版本，并且运行良好。现在对于我的新项目，我想在 ionic 4 中进行开发，但不想卸载 ionic 3。因此，当我运行以下命令在本地安装 ionic 4 时，它会引发错误。

命令：

npm install ionic@rc cordova

错误：

npm install ionic@rc cordova

如何解决这个问题？

我正在尝试在 ionic 4 中实现 popover 并且它为我显示了这个错误，我已经为 popover 创建了一个独特的组件并且我正在页面上实现，所以我点击按钮来创建它给这个的组件错误。

我正在使用延迟加载并将模块导入文件，我做错了什么？

ERROR Error: "Uncaught (in promise): Error: No component factory found for ProfileComponent. Did you add it to @NgModule.entryComponents?

弹出模块

ERROR Error: "Uncaught (in promise): Error: No component factory found for ProfileComponent. Did you add it to @NgModule.entryComponents?

页面模块：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { ProfileComponent } from './profile.component';

@NgModule({
  declarations: [ProfileComponent],
  imports: [
    CommonModule,
  ],
  entryComponents: [ProfileComponent],
})
export class ProfileModule { } …

我正在尝试使用formControl使该选项在Ionic Select 中显示为选中状态，但是它不起作用，该值是在表单中设置的，当我键入 console.log (this.form) 时，该字段的值会出现，但是它没有出现在 select 中，是空白的。

我正在使用 ionic 4 版本。

HTML：

<!-- Analysis Mode -->
<ion-col size="12">
  <ion-label class="custom-label" stacked>Modo de Análise</ion-label>
  <ion-select formControlName="analysis_mode" interface="popover">
    <ion-select-option value="1">Aleatório</ion-select-option>
    <ion-select-option value="2">Sequencial</ion-select-option>
  </ion-select>
 </ion-col>

形式：

this.form = this.formBuilder.group({
  analysis_mode: new FormControl(null, Validators.required),
  value: new FormControl(null, Validators.required),
});


this.form.controls['analysis_mode'].setValue(1);

我正在尝试ngx-translate与我的Ionic 4项目一起使用，我已经遵循了本指南。它在我的浏览器中运行良好，但是当我在我的 android 设备上构建和测试时它无法转换。

我已经使用npm然后添加到导入中安装了它，创建了函数并将标签添加到我的 HTML 中。

这是我的代码

安装使用：

npm install @ngx-translate/core @ngx-translate/http-loader --save

app.module.ts ：

import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {RouteReuseStrategy} from '@angular/router';
import {IonicModule, IonicRouteStrategy} from '@ionic/angular';
import {SplashScreen} from '@ionic-native/splash-screen/ngx';
import {StatusBar} from '@ionic-native/status-bar/ngx';
import {AppComponent} from './app.component';
import {AppRoutingModule} from './app-routing.module';
import {CallNumber} from '@ionic-native/call-number/ngx';
import {Camera} from '@ionic-native/camera/ngx';
import { AuthServiceService } from './auth-service.service';
import { IonicStorageModule } from '@ionic/storage';
import { TranslateModule, …

我有一台需要通过 WiFi 连接到我的 Android 设备的热敏打印机。我需要在触发按钮时自动打印它（没有打印对话框）

目前，我使用的是 Ionic 4，但我找不到任何支持 ESC/POS 语言的库。我可以使用任何图书馆？

注意：以下解决方案适用于 Ionic 4 和 5。

我有一个 Ionic 4 应用程序，我想要一个透明的内容。

这不起作用，并且内容始终为白色。我也将其添加到 css 中：

ion-content{
  --ion-background-color: transparent;
}

我使用 vue create 创建了新的 vue 项目，并根据以下教程添加了离子和电容器vue 离子电容器教程

yarn add @capacitor/core @capacitor/cli
yarn cap init 
yarn cap add android/ios and electron

 update capacitor.config.json as follow


  {
   "appId": "xxxx.xxx.xxxx.vuecapacitordemo2",
   "appName": "vuecapacitordemo2",
    "bundledWebRuntime": true,
    "npmClient": "yarn",
    "webDir": "dist"
   }

我在运行电子时遇到问题，纱线运行电子：开始，我得到 net::ERR_FILE_NOT_FOUND 。谷歌搜索答案发现几个答案都导致添加 具有以下内容的link_1 link_2 link_3 vue.config.js 文件。具有不同的 publicPath 值

 module.exports={
      publicPath: '/',
      runtimeCompiler: true
 }

这会导致应用程序无法在启动画面之外继续进行。任何提示/想法如何解决这个问题？

提前致谢

我想在滚动时隐藏和显示我的标签栏。想要在用户向下滚动时隐藏它并在向上滚动时显示它。onScroll方法中如何判断方向？

下面是我的 onScroll 函数：

onScroll($event: CustomEvent<ScrollDetail>) {
    if ($event && $event.detail && $event.detail.scrollTop) {
        let scrollTop = $event.detail.scrollTop;
        console.log($event, scrollTop);
        document.querySelector('ion-tab-bar').style.display = 'none';
    }
}

我相信该插件FingerprintAIO可能不受ionic 4.

当我使用下面的命令来安装cordova和ionic插件全部似乎罚款：

ionic cordova plugin add cordova-plugin-fingerprint-aio
npm install @ionic-native/fingerprint-aio

在我的app.module.ts我有以下代码：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import {FingerprintAIO} from '@ionic-native/fingerprint-aio';

@NgModule({
  declarations: [AppComponent],
  entryComponents: [], …