小编Moh*_*opi的帖子

ionic 4中的(按键)事件未触发

根据此链接https://ionicframework.com/docs/api/input#events ionic 支持按键事件,该事件在浏览器中工作正常,但在移动设备中未触发

html

<ion-item>
  <ion-label>Default Label</ion-label>
  <ion-input (keypress)="test($event)"></ion-input>
</ion-item>
Run Code Online (Sandbox Code Playgroud)

ts

test(event){

console.log(event);
 e.preventDefault();
}
Run Code Online (Sandbox Code Playgroud)

上面的代码在 ionic serve 中工作正常,而不是在移动设备中

根据这个https://developer.mozilla.org/en-US/docs/Web/API/Document/keypress_event keypress 被贬低我不明白

我尝试过的事件:keypress、keydown、keyup、ionblur、ionChange、input 等等

javascript forms events angular ionic4

9
推荐指数
1
解决办法
1万
查看次数

如何返回一个空的observable

根据这个答案如何在rxjs中返回一个空的observable我已经尝试了所有它但它对我不起作用

这是我的代码

post(url):Observalbe<any>{
   if(this.holder.nullConnection()){ //checking internet connection
      //return empty observalbe
      return Observable.empty() ;
    }else{
      return this.http.post(this.configurator.restServerBaseUrl+url,data)
      .map((result:Response)=> {
        return result.json()
      })
    }
}
Run Code Online (Sandbox Code Playgroud)

我已经尝试了几乎所有的答案,你可以看到上面的堆栈问题任何帮助返回一个空洞的想法.

observable ionic2 angular

6
推荐指数
1
解决办法
8470
查看次数

离子2中的可滚动段(水平)

我试图使用ionic2中的段进行水平滚动.这是代码:

home.ts:

<ion-scroll scrollX="true" style="width:100vw;height:350px" >
<ion-segment [(ngModel)]="relationship" color="primary">


      <ion-segment-button value="friends" (ionSelect)="selectedFriends()">
        Friends
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
       <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>
      <ion-segment-button value="enemies" (ionSelect)="selectedEnemies()">
        Enemies
      </ion-segment-button>

    </ion-segment>
      </ion-scroll>
Run Code Online (Sandbox Code Playgroud)

根据这个文件,我使用离子段外的离子滚动,所以我得到这样的UI.

图片

如何根据名称的长度显示我的名字,并仅显示3到4个名称.用户滚动后,应逐个显示下一个名称.

scroll segment ionic2 angular

6
推荐指数
2
解决办法
7854
查看次数

ionic3 - ios键盘隐藏焦点上的输入字段,直到给出一些输入

请找到我的下面ionic info命令

cli包:(/ usr/local/lib/node_modules)

@ionic/cli-utils  : 1.9.2
ionic (Ionic CLI) : 3.9.2
Run Code Online (Sandbox Code Playgroud)

全球套餐:

Cordova CLI : 7.0.1
Run Code Online (Sandbox Code Playgroud)

本地包裹:

@ionic/app-scripts : 1.3.12
Cordova Platforms  : android 6.2.3 ios 4.4.0
Ionic Framework    : ionic-angular 3.5.0
Run Code Online (Sandbox Code Playgroud)

系统:

ios-deploy : 1.9.2
Node       : v6.11.2
npm        : 3.10.10
OS         : macOS High Sierra
Xcode      : Xcode 9.0 Build version 9A235
Run Code Online (Sandbox Code Playgroud)

这是我的代码.

<div style="position: absolute; bottom: 0px;">
        <img src="assets/login/welcome_login_bg.png" />
        <ion-list style="position: initial">
            <form [formGroup]="loginForm">
                <ion-item no-padding class="firstItem">
                    <ion-input [(ngModel)]="username" formControlName="username" type="email" spellcheck="false" autocapitalize="off"> …
Run Code Online (Sandbox Code Playgroud)

forms keyboard cordova ionic2 ionic3

6
推荐指数
0
解决办法
771
查看次数

如何使用ngcordova文件传输插件将拍摄的图像传输到我的ftp

我正在尝试将图像上传到我的FTP.

到目前为止我所获得的是这个plnkr

我的cordova文件传输看起来像

$scope.upload =function(){

      var options = {
         fileKey: "file",
         fileName: "gopi",
         chunkedMode: false,
         mimeType: "image/jpeg",
         params : {'user_token':'Chandru@123', 'user_email':'wepopusers'} // directory represents remote directory,  fileName represents final remote file name
       };
       console.log(options);
      $cordovaFileTransfer.upload('ftp://308.3d8.myftpupload.com/',  MyService.getImgPath(), options)
        .then(function(result) {
          // Success!
          console.log(result);
          console.log("SUCCESS: " + JSON.stringify(result.response));
          alert('ftp success');
        }, function(err) {
          // Error
          console.log(err);
          alert('ftp fail');
          console.log("ERROR: " + JSON.stringify(err));
        }, function (progress) {
          // constant progress updates
          console.log(progress);
        });

    };
Run Code Online (Sandbox Code Playgroud)

我对cordova文件的错误函数的响应如下

FileTransferError {code:2,source:"file:///storage/sdcard0/Android/data/com.ionicframework.camera108827/cache/1462186990291.jpg",target:" ftp://308.3d8.myftpupload.com/ " ,http_status:null,body:null ...} body:nullcode:2exception:nullhttp_status:nullsource:"file:///storage/sdcard0/Android/data/com.ionicframework.camera108827/cache/1462186990291.jpg"target:" …

ftp angularjs cordova ionic-framework

5
推荐指数
1
解决办法
961
查看次数

如何在离子2中的表单上显示错误消息

下面的代码和平在浏览器中工作正常.

这是我的.html

 <ion-item>
   <ion-label primary floating>FIRST NAME</ion-label>
   <ion-input type="text" id="firstname" class="form-control" formControlName="firstname"></ion-input>
 </ion-item>

 <p *ngIf="myForm.controls.firstname.errors && myForm.controls.firstname.dirty ">
    <small class="up">
      <strong> <i> Min 3 chars</i></strong>
    </small>
 </p>
Run Code Online (Sandbox Code Playgroud)

这是我的.ts文件

this.myForm =  new FormGroup({
            'firstname'      : new FormControl('',[Validators.required,Validators.minLength(3),Validators.maxLength(10)]),
            'lastname'       : new FormControl('', [Validators.required,Validators.minLength(1),Validators.maxLength(10)]),
            'useridphone'    : new FormControl('', [Validators.required,Validators.minLength(10),Validators.maxLength(10)]),
            'password'       : new FormControl('',Validators.compose([Validators.required,Validators.minLength(4),Validators.maxLength(25),
                               Validators.pattern(this.passwordRegex)])),
            'confirmpassword': new FormControl('',Validators.required),
            'email'          : new FormControl( '', Validators.compose([ Validators.required, Validators.pattern(this.emailRegex) ]) )
    })
Run Code Online (Sandbox Code Playgroud)

当我尝试构建我的项目(`ionic build android')时,我在下面收到错误

类型'{[key string]上不存在属性'firstname':AbstractControl; }".

这是我的 ionic info

Cordova CLI: 6.3.0 
Ionic Framework Version: …
Run Code Online (Sandbox Code Playgroud)

forms validation ionic2 angular

5
推荐指数
1
解决办法
8300
查看次数

导航失败:模板解析错误:由于它不是'signature-pad'的已知属性,因此无法绑定到'options'

我正在尝试在我的ionic 3项目中实现angular2签名板,但出现上述问题时出现错误。我正在关注本教程链接。它在ionic2中工作正常,但是当我在ionic 3中尝试时,出现如下错误

Failed to navigate:  Template parse errors:
Can't bind to 'options' since it isn't a known property of 'signature-pad'.
1. If 'signature-pad' is an Angular component and it has 'options' input, then verify that it is part of this module.
2. If 'signature-pad' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("
    <ion-col></ion-col>
    <ion-col> …
Run Code Online (Sandbox Code Playgroud)

signaturepad ionic2 ionic3 angular

5
推荐指数
2
解决办法
2876
查看次数

Ionic 3:类型'any'不是构造函数类型

当我应对并移动到具有离子3的mac时,我在我的linux任务中有了我的离子2项目.

所以我创建了一个新项目,用新项目替换了页面,提供了components文件夹,我得到了错误就像cannot find module "ionic-native"将我的插件导入app.modulte.ts文件后我得到的错误就是'类型'任何'不是构造函数功能类型

我的终端显示

17:39:48]  typescript: node_modules/@ionic-native/app-version/index.d.ts, line: 25
            Type 'any' is not a constructor function type. [17:39:48]  typescript: node_modules/@ionic-native/geolocation/index.d.ts, line: 127 [17:39:48]  typescript: node_modules/@ionic-native/google-analytics/index.d.ts, line: 30 [17:39:48]  typescript: node_modules/@ionic-native/network/index.d.ts, line: 49 [17:39:48]  typescript: node_modules/@ionic-native/sms/index.d.ts, line: 41 [17:39:48]  typescript: node_modules/@ionic-native/social-sharing/index.d.ts, line: 29 [17:39:48]  typescript: node_modules/@ionic-native/sqlite/index.d.ts, line: 115

      L25:  export declare class AppVersion extends IonicNativePlugin {

            Type 'any' is not a constructor function type.

     L127:  export declare class Geolocation extends IonicNativePlugin {

            Type 'any' is not a …
Run Code Online (Sandbox Code Playgroud)

native node-modules ionic2 ionic3 angular

4
推荐指数
1
解决办法
5412
查看次数

离子3侧菜单不适用于ios

我的离子侧菜单在Android手机中工作但在ios中我没有得到.

这是.html的代码

<button ion-button menuToggle icon-only class="menuButton"> 
  <ion-icon name="menu"></ion-icon>
</button>

<ion-menu [content]="mycontent">
  <ion-content>
    <ion-list>
      <p>some menu content, could be list items</p>
    </ion-list>
  </ion-content>
</ion-menu>

<ion-nav #mycontent ></ion-nav>
Run Code Online (Sandbox Code Playgroud)

我不明白我的问题在哪里,如果你需要什么,请告诉我

我的侧面菜单在Android和浏览器中工作,除了ios

ionic2 side-menu ionic3

4
推荐指数
1
解决办法
4786
查看次数

ionic-4 ion-select-option 上的文本换行

超文本标记语言

<ion-item>
    <ion-label>Popover</ion-label>
    <ion-select [interfaceOptions]="customPopoverOptions" interface="popover" placeholder="Select One">
      <ion-select-option value="brown" text-wrap>Brownasdfasdfasdfasdfadfadsfasdfadfasdfafdsadfaf</ion-select-option>
      <ion-select-option value="blonde">Blonde</ion-select-option>
      <ion-select-option value="black">Black</ion-select-option>
      <ion-select-option value="red">Red</ion-select-option>
    </ion-select>
  </ion-item>
Run Code Online (Sandbox Code Playgroud)

图像

SAS:

ion-select-option{
   ion-label{
     white-space: normal !important;
   }
}
Run Code Online (Sandbox Code Playgroud)

我无法覆盖现有的white-space: nowrap

我想知道如何覆盖shadow-dom css

css shadow-dom ionic4

4
推荐指数
2
解决办法
1万
查看次数