标签: ionic3

我的项目运行正常，唯一的问题是搜索是否区分大小写。它可以很好地搜索子字符串，但是如果我输入“ Test”，它将忽略“ test”作为有效结果。

我正在使用pouchdb-find来使搜索更容易，并且与混浊搜索和限制/跳过分页参数更加相关。

我正在使用ion-searchbar为用户键入查询的字符串。

这是我的控制器代码节选：

@Component({
    selector: 'page-notas',
    templateUrl: 'notas.html'
})
export class NotasPage {
    notas: Array<Object> = [];
    zone: any = new NgZone({ enableLongStackTrace: false });
    db: any = new PouchDB('banco_de_dados.bd');
    db_limit = 10;

    pouch_query: object = {
        selector: { data_emissao: { $gt: null } },
        sort: [ {'data_emissao' : 'desc'} ],
        limit: 10,
        skip: 0,
    };

    constructor(
        private scanner: BarcodeScanner,
        private toastCtrl: ToastController,
        private googleAnalytics: GoogleAnalytics,
        public …

我是第一次使用Ionic,我正在尝试将未经身份验证的用户重定向到我的登录页面.

登录时,用户获取存储在本地存储中的json-web-token.我还有一个身份验证服务,它有一个loggedIn()检查令牌是否有效的方法.

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { tokenNotExpired } from 'angular2-jwt';
import { Storage } from '@ionic/storage';


@Injectable()
export class AuthServiceProvider {

constructor(
  public http: HttpClient,
  public store: Storage,
 ) { }

 ...

 public loggedIn(): boolean {
   return tokenNotExpired('__local/_ionickv/token');
 }

 ...

}

在我的HomePage组件内部,然后在加载页面之前检查用户是否已登录ionViewCanEnter().

import { Storage } from '@ionic/storage';
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { …

home.html

创建卡并访问json以获取值和数据

<ion-card *ngFor="let shayari of shayar_list">
    <div class="card-title" [ngStyle]="{'color':shayari.color{{shayari.title}}</div>
</ion-card>

.ts

创建一个json并访问math.random函数调用

this.shayar_list = [{
  title: 'Love Shayari',
  color : this.getRandomColor(),
]}

创建一个随机的颜色生成器功能

getRandomColor()
  {
      var color = "#";
      for (var i = 0; i < 3; i++)
      {
          var part = Math.round(Math.random() * 255).toString(16);
          color += (part.length > 1) ? part : "0" + part;
      }
      return color;
  }

在我的用例中,我想显示侧面菜单以及我的离子3角应用程序中的选项卡.用例是:最初显示选项卡,隐藏侧边菜单(设置为启用(false)).第一页显示了一个添加到购物车的按钮,这样做会在标题区域显示购物车,点击购物车会显示登录页面.一旦您登录,订单摘要页面就会出现.此时我想显示侧边菜单.所以ionviwedidload我在设置menu.enable(true).虽然它显示菜单图标但不显示实际菜单.

最小的测试用例是https://www.dropbox.com/s/tq202w3p6yf32fj/tab-menu_app.zip?dl=0

尝试:

1.运行应用程序
2.单击"添加到购物车"按钮
3.单击右侧标题中的购物车
4.这将显示登录页面模型.单击登录按钮
5.摘要页面显示菜单图标.点击它没有任何作用

ionic info

cli软件包：（/ usr / local / lib / node_modules）

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

全局软件包：

cordova (Cordova CLI) : 8.0.0 

本地套餐：

@ionic/app-scripts : 3.1.8
Cordova Platforms  : android 6.3.0
Ionic Framework    : ionic-angular 3.9.2

系统：

Node : v8.11.0
npm  : 5.6.0 
OS   : macOS High Sierra

环境变量：

ANDROID_HOME : not set

其他：

backend : pro

我的提供者

import { Injectable } from '@angular/core';
import { Storage } from '@ionic/storage';

@Injectable()
export class GlobalTokenProvider {

  constructor(public storage: Storage) …

当切换按钮"打开"时,请参阅下面的函数buttonOn(),

我想在buttonOff()"关闭"时切换它,如下所示

html的

<ion-toggle (ionChange)="buttonOn()"></ion-toggle>

.TS

buttonOn() { 
    // this function is called;
}

buttonOff() {
   // how to call this function when toggle button gets off?
}

根据Angularfire2 Docs的说法： AngularFireDatabase允许您使用Firebase的原始数据库Realtime Database。对于需要跨客户端实时同步状态的移动应用程序而言，这是一种高效，低延迟的解决方案。

但是，有AngularFireDatabaseModule，我不知道它是什么。因此，我想更详细地了解这两个（如果可用，请提供更详细的链接）以及何时使用AngularFireDatabase和 AngularFireDatabaseModule。

我有一个数组中的任务列表,我需要运行它们来调用Web服务.

但问题是,它们在一个数组中,我需要一次运行一个,这意味着:只有在完成这一个时才运行下一个,无论是否发生错误.

我在这里使用了这个代码,我使用的是combineLatest,但是这样我只有在完成所有这些时才得到结果.

let arrayOfTasks: ServerTask[] = cacheInfo.cacheData;
let observables = [];
arrayOfTasks.forEach((task: ServerTask) => {
  if (task.method === 'post') {
    let observable$: any = this.restService.sendPost(task.action, task.payload, false, task.cacheName);
    observables.push(observable$);
  }
});

const combined = combineLatest(observables);
combined.subscribe((value: any[]) => {
  console.log('ARRAY DATA RETURNED');
  console.log(value);
}, error => {
  console.error(`Error running stored tasks: ${error}`);
}, () => {
  console.log('All cache tasks executed...');
});

有什么想法吗？

编辑1:

正如@trichetriche所说,这是最终的解决方案:

concat(...observables).subscribe((result: any) => {
  console.log('RESULT: ', result);
}, error …

我需要在项目中运行代码“ this.backgroundMode.enable（）”，但它显示了以下错误：

“对象（...）不是函数”

它通过以下方式将其导入app.module.ts中：

import {BackgroundMode} from '@ ionic-native / background-mode / ngx';
...
providers: [
...
BackgroundMode
...]

在页面中（在我的情况下，在deviceready之后，在app.component.ts中，如官方文档中所述），我使用：

import {BackgroundMode} from '@ ionic-native / background-mode / ngx';
constructor(private backgroundMode: BackgroundMode) { }
...
this.backgroundMode.enable();

请在我的项目中运行此插件

我正在尝试通过使用以下命令来构建用于生产的离子项目。 ionic cordova构建android --prod --release，但是我总是会遇到此错误： JavaScript 堆满了内存，因此我在网上查看了以下解决方案：在ionic中添加了节点--max_old_space_size = 4096。 cmd文件，但是没有用。当我使用Firebase时，我尝试使用以下命令降级Firebase：

npm install --save firebase@4.x

因此，现在我的项目的googleplus插件的GooglePlus类不被视为离子提供程序。这是我用来安装它的命令：

ionic cordova plugin add cordova-plugin-googleplus --save --variable REVERSED_CLIENT_ID=MY_REVERSE_CLIENT_ID

npm install --save @ionic-native/google-plus

当我尝试在我的app.modules.ts中的providers部分中导入GooglePlus类时，无法识别该类。我尝试卸载并重新安装所有内容，但无法正常工作。

{


"name": "app name",
  "version": "2.0.1",
  "author": "auhtors name",
  "homepage": "website url",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/animations": "5.2.10",
    "@angular/common": …