标签: ionic2

我有一个输入字段,用户可以输入他的地址并获得自动建议:

 <ion-label color="primary" stacked>Adresse:</ion-label>
        <ion-input type="text" ng-model="autocomplete.query" ng-change="updateSearch()"></ion-input>

我的班级有一个更新方法,我想做点什么,但不幸的是他没有进入它.

updateSearch()
  {
    console.log('aaa');
    if (this.autocomplete.query == '') {
      this.autocompleteItems = [];
      return;
    }
}

有任何想法吗？

在我单击离子应用键盘中的“发送”按钮后，它被隐藏了。我的代码：

<ion-item>
    <ion-labe>Text</ion-label>
    <ion-textarea [(ngModel)]="text" placeholder="Write a Message …"></ion-textarea>
</ion-item>
<a (click)="sendMessage();">Send</a>

单击操作后，我需要键盘保持打开状态。请帮帮我。

在Applozic/Ionic集成应用程序中,我需要为用户或组获取最后的消息和聊天时间

我已经阅读了Applozic - Ionic集成的文档,但还没有找到上面的解决方案.它只在下面提到

//Get Total Unread Count
applozic.getUnreadCount(function(response){
     var count = response;
    },
    function(error){alert(error)
   });
   
//Get Unread count per user
   var userId = 'USER_ID'; //pass UserId with which unread count 
   applozic.getUnreadCountForUser(userId,function(response){
     var count = response;
    },
    function(error){alert(error)
   });
   
 //Get unread count per group
   var groupId = 'GROUP_ID'; // pass groupId in which unreadcount required

  applozic.getUnreadCountForGroup(groupId,function(response){
       var count = response;
    },
     function(error){
    });

我想每1秒运行一次功能.搜索后,我发现setInterval但它对我不起作用.

setInterval(function(){ 
   this.myfuntion();

}, 1000);

我也试过,this.myfuntion但它也不起作用.

我的应用程序中有一些聊天功能,当输入新消息时,它会自动滚动到底部<ion-content>,但是,就像许多聊天应用程序一样,如果您在聊天中向上滚动以阅读最新消息之前的内容,我不想滚动.只有当用户位于屏幕的最底部时,我才会在新消息进入后滚动到底部.我还没有解决这个问题.

这是我目前的代码:

scrollToBottom() {

  // If the scrollTop is greater than the height, we are at the bottom,
  // in which case, show scrolling animation
  let dimensions = this.content.getContentDimensions();
  let scrollHeight = dimensions.scrollHeight;
  let scrollTop = dimensions.scrollTop;
  let contentHeight = dimensions.contentHeight;
  let heightAndScrollTop = contentHeight + scrollTop;

  // This is the best I can get, assuming that the screen is in a consistent dimension, which we all know is basically non-existent due to all the different types of …

我想将图像设置为我的Ionic 2应用程序的每个页面的括号.

我知道如何在一个页面的HTML或CSS中做到这一点(我可以在所有页面中完成).

我知道如何设置整个应用程序的背景颜色 theme\variables.scss

$background-color: map-get($map: $colors, $key: primary);

(例如)

但它似乎也在做同样的事情

$background-image: url('assets/images/background-image.jpg');

不起作用.即使一页的css中完全相同的行也能正常工作.

.class-name-here{
    background-image: url('assets/images/background-image.jpg');
}

是否可以将图像设置为Ionic 2/Ionic 3中整个应用程序的默认背景？

我建立了一个模态页面,就像一个自定义警报.我需要在警报中添加一个图像,所以我按照这个来制作自定义警报窗口:如何在离子2中进行自定义警报？

问题是模态被拉伸以适应屏幕高度.有没有办法让它始终适合自己的内容高度？那么高度是它必须的最小值？

这是页面的scss:

modal-alert.scss

page-modal-alert {
    background-color: rgba(0, 0, 0, 0.5);
    ion-content.content{
        top: 10%;
        left: 10%;
        width: 80%;
        height: 375px; // <-- fixed
        //height: 75%; // <-- will stretch to screen size
        border-radius: 10px;
        .scroll-content {
            border-radius: 20px;
        }
    }
}

页面模板:

modal-alert.html

<ion-content padding>
  <img src="assets/img/20pointsBox.png">    
  <div>
    <p>{{ text }}</p>
    <ion-buttons>
      <button full ion-button color="secondary" (click)="dismiss()">
        OK
      </button>
    </ion-buttons>
  </div>
</ion-content>

编辑:

当上面的类设置为模态时,它看起来像这样(但是带有图像,文本和一个按钮):

文本和图像内容是动态的,我在运行时更改它们,因此有时此模式的固定高度与其内容的实际高度不匹配.

有没有办法让模态高度适合其内容的总高度？

我遵循此处找到的答案：Ionic 2 Alert定制

但是我找不到必须设置样式的所有其他类或元素，因此警报看起来像我想要的。

我编辑了代码，如下所示：

app.scss：

.alertCustomCss {
  background-color: color($colors, dark, base);
  color: white;
  button {
      color: white !important;
  }
}

ts：

const alert = this.alertCtrl.create({
    title: title,
    subTitle: msg,
    buttons: ['OK'],
    cssClass: 'alertCustomCss'
});
alert.present();

但这使所有文本变为白色，替换了包含弹出窗口的模式页面的透明性，并将其设置为设置“背景色”（因此，不再显示称为弹出窗口的页面）。该按钮的文本设置为白色。

请注意，弹出窗口周围的背景不再透明。

问题是如何设置文本占位符而不是整个页面的背景色？要使用哪些CSS属性？

更广泛的问题：可以设置样式的警报弹出窗口有哪些元素（css类或指令）？标题文字颜色，内容文字字体等。

我收到错误消息：

模板解析错误：找不到管道“ amDateFormat”

这是我的 app.module.ts

import { NgModule } from '@angular/core';
...
import { MomentModule } from 'angular2-moment';
...

@NgModule({
  declarations: [
    MyApp
  ],
  imports: [
    ...
    MomentModule,
    ...
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    ...
  ]
})
export class AppModule { }

然后在service-booking-details.ts执行以下操作：

import { Component} from '@angular/core';
import { IonicPage, NavController, NavParams} from 'ionic-angular';
import { MomentModule } from 'angular2-moment';
...    

@IonicPage()
@Component({
  selector: 'page-item-detail',
  templateUrl: 'service-booking-detail.html'
})
export class ServiceBookingDetailPage {
  service: …

我正在使用ionic，并且已经通过git从machine1到machine2提取了我的项目。

我的离子信息给了我这个：

[错误] ./node_modules/@ionic/app-scripts/package.json文件出现错误：FILE_NOT_FOUND

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

@ionic/cli-utils  : 1.19.0
ionic (Ionic CLI) : 3.19.0

Run Code Online (Sandbox Code Playgroud)

本地套餐：

@ionic/app-scripts : not installed
Ionic Framework    : ionic-angular 3.7.1

Run Code Online (Sandbox Code Playgroud)

系统：

Node : v8.9.1
npm  : 5.5.1
OS   : macOS High Sierra

Run Code Online (Sandbox Code Playgroud)

其他：

backend : pro

Run Code Online (Sandbox Code Playgroud)

运行时，sudo npm install我得到以下信息：

npm WARN checkPermissions缺少对/ Users / gerald / Documents / ionic / yesterdayweather / node_modules的写权限npm WARN checkPermissions缺少对/ Users / gerald / Documents / ionic / yesterdayweather / node_modules / @ …