标签: ionic3

我知道cordova插件不可用ionic serve，我总是在尝试使用cordova插件之前检查我是否在cordova环境中。

说完之后。我不知道为什么会出现此错误：

ERROR Error: Uncaught (in promise): cordova_not_available
    at c (polyfills.js:3)
    at polyfills.js:3
    at rejected (main.js:1469)
    at t.invoke (polyfills.js:3)
    at Object.onInvoke (core.js:4749)
    at t.invoke (polyfills.js:3)
    at r.run (polyfills.js:3)
    at polyfills.js:3
    at t.invokeTask (polyfills.js:3)
    at Object.onInvokeTask (core.js:4740)
defaultErrorLogger @ core.js:1448
21:23:35.110 

我不知道它是如何开始的，我觉得它有什么做的ionic livereload解决办法，但我已经更新我的应用程序的脚本版本，并重新安装所有的node_modules，plugins并platforms和剧照坚持的问题。

cli packages: (C:\Users\Saninn.000\AppData\Roaming\npm\node_modules)

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

global packages:

    cordova (Cordova CLI) : 8.0.0

local packages:

    @ionic/app-scripts : 3.1.9
    Cordova Platforms  : …

启动/加载应用程序需要很长时间。而且当我导航到页面时，会有 2.3 秒的延迟。总体而言，它比普通的 android 应用程序慢。如何减少加载时间并加快 Android 应用程序的速度？

我有一个离子页面，其中有一个可滚动的 div。

<div #list class="main">
    <div class="row-container" *ngFor="let log of logs">
        <p class="log">{{log.guess}}  -  {{log.result}}</p>
        <div class="score-container">
            <ion-icon name="star" style="color: gold;"></ion-icon>
            <p class="score">{{log.score}}</p>
        </div>
    </div>
</div>

div的类：

.main {
    height: 90%;
    border-top: 1px solid black;
    overflow-y: scroll;
}

我想在页面加载时以及在列表中添加新项目时自动滚动到 div 的底部。

到目前为止，我已经尝试使用@ViewChild('list') list:any;来获取元素。然后：

this.list.scrollTop = this.list.scrollHeight;

和

this.list.scrollToBottom(100);

但scrollTop就是行不通。scrollToBottom抛出一个错误，指出 scrollToBottom 不是一个函数。

如何滚动到div的底部？

我已成功更新 angularfire 5.0.0.rc 8 和 firebase 5.0.2，没有错误模块。我想我要做的最后一件事是更改此代码以检索所有数据

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { IonicPage } from 'ionic-angular/navigation/ionic-page';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';
import { Note } from '../../model/note/note.model';
import { NoteListService } from '../../services/note-list.service';

@IonicPage()
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  noteList: Observable<Note[]>

  constructor(public navCtrl: NavController, private noteListService: NoteListService) {
    this.noteList = this.noteListService.getNoteList()
      .snapshotChanges()
      .map(
        changes => {
          return changes.map(c => ({
            key: c.payload.key, ...c.payload.val() …

我正在用离子开发应用程序。当加载页面 scrollToBottom 不起作用时。

Html 部分

<ion-content #content>
</ion-content>

TS部分

@ViewChild(Content) content: Content;

ionViewDidLoad() {
    console.log('ionViewDidLoad PersonalChatPage');
    this.content.scrollToBottom();
}

我正在尝试在 Ionic3 中创建一个自定义菜单，当用户单击那个汉堡包图标时，它需要向元素添加#menu一个open类，我正在尝试使用ngClass

问题是这个图标在我的菜单组件之外，这个图标在我的页面中 home-user

打开后，我的菜单看起来像下一张图片，所以我不能使用 ionic 的默认菜单

所以我的组件menu有一个名为 的变量opened，这个变量决定了我的菜单元素的类

菜单.ts

@Component({
    selector: 'menu',
    templateUrl: 'menu.html',
})

export class MenuComponent {

    opened: boolean = true;

    constructor() {
    }

    toggleMenu() {
        this.opened = !this.opened;
    }
}

所以当我触发时toggleMenu()我改变了opened价值

我在我的组件页面中触发此功能并正常工作

菜单.html

<div id="menu" [ngClass]="opened ? 'open' : ''">
    <a class="menu-item" href="#">Sair</a>
    <ion-icon (click)="toggleMenu()" id="toggleMenu" name="close"></ion-icon>
</div>

那么，我的问题是什么？

toggleMenu()例如，我如何从我的home-user.html页面调用它，该页面也有一个按钮，并且该按钮应该更改opened变量的值

我试过什么

我试图在我的menu.module.ts中创建一个函数来触发该toggleMenu()函数menu.ts …

我需要从 ion-search bar 中删除边框。我在 variable.scss 中尝试了以下代码，但没有运气。我在 ionic 方面很新，所以请详细告诉我。

 .searchbar-input {
      -webkit-box-shadow: 0 2px 2px 0 rgba(255, 255, 255, 1),
        0 3px 1px -2px rgba(255, 255, 255, 1), 0 1px 5px 0 rgba(255, 255, 255, 1);
      box-shadow: 0 2px 2px 0 rgba(255, 255, 255, 1),
        0 3px 1px -2px rgba(255, 255, 255, 1), 0 1px 5px 0 rgba(255, 255, 255, 1);
    }

我有一个表格，我想在其中写下有关课程的一些信息，并通过打开对话框的“+”按钮添加参与者。这是我的表格：

<form novalidate (ngSubmit)="editMode ? saveCourse() : addCourse()" [formGroup]="userForm">
    <ion-item>
        <ion-label stacked>Name</ion-label>
        <ion-input type="text" [(ngModel)]="course.name" formControlName="name" ></ion-input>
    </ion-item>
    <ion-item>
        <ion-label stacked>Language</ion-label>
        <ion-input type="text" [(ngModel)]="course.language" formControlName="language" ></ion-input>
    </ion-item>
    <ion-item>
        <ion-label stacked>Participants</ion-label>
    </ion-item>
    <ion-item>
        <button  item-end class="back_button" (click)="openModal()">
            <ion-icon  ios="ios-add" md="md-add"></ion-icon>
        </button>
    </ion-item>
    <div padding-bottom>
        <button ion-button block outline color="primary" type="submit" >{{(editMode ? 'EDIT_COURSE':'ADD_COURSE') | translate}}</button>
    </div>
</form>

每当我单击调用“openModal()”的按钮时，也会调用表单的 ngSubmit 函数。有什么办法可以避免吗？

在 Ionic 3 + Angular 4 中，我有以下代码：

 <agm-info-window #infoWindow>
                        <strong>{{data.title}}</strong><br>
                      </agm-info-window>

标记仅在单击时打开气泡 如何默认打开？谢谢

我正在尝试使用以下代码按日期分组显示列表，但出现异常无法获取未定义或空引用的属性“forEach”有人可以帮助我请我在哪里做错了

家.ts：

this.events = [{
  id: 1,
  category:'camera',
  title: 'First event',
  date: '2017-12-26'
}, {
  id: 2,
  category:'accessories',
  title: 'Second event',
  date: '2017-12-27'
}, {
  id: 3,
  category:'camera',
  title: 'Third event',
  date: '2017-12-26'
}, {
  id: 4,
  category:'accessories',
  title: 'Fouth event',
  date: '2017-12-27'
},{
  id: 5,
  category:'camera',
  title: 'Fifth event',
  date: '2017-12-26'
}]

}

主页.html：

<ion-content padding>

    <ion-item-group *ngFor="let group of events | groupBy: 'date'">
        <ion-item-divider color="light">
            {{ group.date }}
        </ion-item-divider>
        <ion-item *ngFor="let event of group.events">{{ …