标签: ionic3

我刚刚升级到Ionic 3.0.1所以我可以使用LazyLoading,因为我不能使用我的自定义Pipes:

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'StripHTML'
})

export class StripHTML implements PipeTransform {

  transform(value, args) {
    let striped = value.replace(/(<([^>]+)>)/g, "");

    if (args != null) {
      if (args.split != null) {
        striped = striped.split(args.split);
        if (args.index != null) {
          striped = striped[args.index];
        }
      }
    }

    return striped;
  }
}

并在app.module.ts我已将其添加到声明中:

@NgModule({
  declarations: [
    ........,
    StripHTML
  ],
...

现在当我试图在html模板中使用它时出错:

core.es5.js:1085 ERROR Error: Uncaught (in promise): …

我是Ionic 2的新手,我阅读了Ionic 2文档并认为这段代码可行.它应该在更改时返回当前选择值并将其打印到控制台.

page.html中

<ion-select #C ionChange="onChange(C.value)"> 
                    <ion-option value="a">A</ion-option>
                    <ion-option value="b">B</ion-option>
</ion-select>

page.ts

public CValue:String;
onChange(CValue) {
     console.log(CValue);
}

但是控制台没有给出与此相关的任何内容.我错过了约束中的某些内容吗？

我正在使用离子2的最新版本.我的代码<ion-content padding><form></form></ion-content>里面有一个文本输入.当我尝试在Android上输入内容时,整个页面会被键盘向上推.

html文件

<ion-content class="login-screen" padding>
  <form (ngSubmit)="login()" novalidate>
    <ion-list>
      <ion-item>
        <ion-label fixed>Username</ion-label>
        <ion-input type="text" name="username" [(ngModel)]="username" required></ion-input>
      </ion-item>
      <ion-item>
        <ion-label fixed>Password</ion-label>
        <ion-input type="password" name="password" [(ngModel)]="password" required></ion-input>
      </ion-item>
    </ion-list>
    <button ion-button full type="submit">Login</button>
  </form>
  <button ion-button clear full outline type="button" (click)="openModal()">Forgot Password?</button>
</ion-content>

有什么解决方案吗？

这是一个有趣的问题:我正在尝试测试使用Ionic BarcodeScanner的服务.我有一个基于离子单元测试库的repo ,以便尝试测试.我正在嘲笑BarcodeScanner.scan方法spyOn(..).and.callFake(..)

问题:当我从组件调用扫描方法时,它可以工作.当我在服务中执行完全相同的操作时,它会抛出超时.

组件测试代码:

it("should be able to set a spy on the scanner and test the component", done => {
    const testBC = "123456";
    const spy = spyOn(TestBed.get(BarcodeScanner), "scan");
    spy.and.callFake(() => {
        return new Promise((resolve, reject) => {
            resolve(testBC);
        })
    });

        component.testScanner().then(res => {
            expect(res).toBe(testBC);
            done();
        }, reason => {
            expect(true).toBe(false);
            done();
        })
});

服务测试代码:

it("should be able to set a spy on the scanner and test the service", done => {
    const testBC = …

在跑步的时候ionic build我很好奇--prod和--release旗帜之间的区别？

该离子建立文档状态:

--prod 构建生产应用程序
--release创建Cordova发布版本

虽然Cordova CLI ref没有提到--prod标志,但它表明以下内容--release:

执行发布版本.这通常转换为正在构建的底层平台的发布模式.

看看构建输出的差异,构建--prod似乎运行了Ionic '生产'构建,因为它还运行ngc和uglify(它本身运行cleancss)任务.

当我运行构建时--release,我似乎得到了一个Cordova版本构建,它(根据文档)尝试在您要定位的任何平台上运行发布版本.

这些是唯一的差异,还是我过度简化？

供参考,请注意以下输出APK文件大小:

• 产品标志:9.8 MB
• 发布标志:11.7 MB
• 产品和发布标志:8.9 MB

我正在使用Ionic Framework(3.9.2)和CLI(3.20.0)的最新版本(ATTOW).

我有一个Web应用程序(Angular)和移动应用程序(Ionic).它们都共享相同的Firestore数据.

使用Web应用程序更新现有数据但离子应用程序显示重复项目(重新启动移动应用程序后副本将会消失),我在Firestore中检查项目数据本身,它已更新且唯一.有没有人对此有任何线索？

此问题仅发生在除了Web应用程序之外的移动应用程序上,两者都使用 "angularfire2": "^5.0.0-rc.4",

   import { AngularFirestore, AngularFirestoreCollection } from 'angularfire2/firestore';

   this.posts$ = this.db.getRecentPosts().snapshotChanges().pipe(
      map(arr => arr.map(doc => {
          return { id: doc.payload.doc.id, ...doc.payload.doc.data() }
        }
      ))
    );

是否研究过(似乎并非100%肯定)angularfire2问题: AngularFirestoreCollection有时会在插入新记录后返回记录副本

Page在呈现之前获取数据异步的正确方法是什么？

Angular2@CanActivate据我所知,建议装饰者.可悲的是,这不适用于Ionic2,至少不适合我和其他人

显然Ionic2是与@CanActivate装饰者做了一些事情, 但是看来它没有记录,我无法弄清楚它究竟做了什么.

然而,由于离子学缓存,这个人指出应该Ionics View States反正使用.他的例子如下:

  onPageWillEnter() { 
      return this._service.getComments().then(data => this.comments = data);
  }

看起来他期待Ionic考虑返回的承诺,但是快速浏览一下 Ionics消息来源(至少我认为是这样)会忽略返回的值.因此,无法保证在呈现页面之前解析promise .这是onPage*的示例,以及它如何根据需要/预期执行.

所以我迷路了,一个人如何完成这个简单的任务呢？

在第一个链接中,建议在导航到页面之前解析数据,这会增加被调用者页面所需数据的知识.在我看来,这不是一个选项.

*编辑:添加负面示例

当我使用命令时:ionic cordova build android这是我得到的:

cp:copyFileSync:无法写入dest文件(代码= ENOENT):/ Users/mehdigriche/work/cam1/test/platforms/android/res/xml/config.xml

解析/Users/mehdigriche/work/cam1/test/platforms/android/res/xml/config.xml失败(节点:2306)UnhandledPromiseRejectionWarning:未处理的承诺拒绝(拒绝ID:1):错误:ENOENT:没有这样的文件或目录,打开'/Users/mehdigriche/work/cam1/test/platforms/android/res/xml/config.xml'

[10:50:14]皮特说完了

任务':app:processDebugResources'的执行失败.

执行"ionic cordova build android"时会出现此错误.搜索了很长时间但没有运气.有人可以帮忙吗？

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:processDebugResources'.
> Failed to execute aapt

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --
debug option to get more log output.

* Get more help at https://help.gradle.org

BUILD FAILED in 4m 18s
(node:9516) [DEP0018] DeprecationWarning: Unhandled promise rejections are 
deprecated. In the future, promise rejections that are not handled will 
terminate the Node.js …

请在下面找到Android硬件后退按钮操作的以下代码ionic3.由于Ionic4采用角路由导航如何弹出事件将发生的后退按钮？如果我们想要弹出到最后一页,我们可以使用以下代码this.navCtrl.goBack('/products');.但是我们如何才能将它用于Android硬件后退按钮动作ionic4呢？

Ionic3硬件后退按钮动作

this.platform.registerBackButtonAction(() => {
    let activePortal = this.ionicApp._loadingPortal.getActive() ||
        this.ionicApp._modalPortal.getActive() ||
        this.ionicApp._toastPortal.getActive() ||
        this.ionicApp._overlayPortal.getActive();
    if (activePortal) {
        activePortal.dismiss();
    } else {
        if (this.nav.canGoBack()) {
            ***this.nav.pop();***
        } else {
            if (this.nav.getActive().name === 'LoginPage') {
                this.platform.exitApp();
            } else {
                this.generic.showAlert("Exit", "Do you want to exit the app?", this.onYesHandler, this.onNoHandler, "backPress");
            }
        }
    }
});