标签: ionic2

删除后退按钮Ionic2

我试图从我的页面的导航栏中删除后退按钮.有没有办法这样做

在此输入图像描述

谢谢

ionic2

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

获取ionic2中的当前位置

我是Ionic 2的新手并且遵循一些教程.

在这种情况下,我需要更改以下方法:

 applyHaversine(locations){

        let usersLocation = {


            lat: 40.713744, 
            lng: -74.009056
        };

        locations.map((location) => {

            let placeLocation = {
                lat: location.latitude,
                lng: location.longitude
            };

            location.distance = this.getDistanceBetweenPoints(
                usersLocation,
                placeLocation,
                'miles'
            ).toFixed(2);
        });

        return locations;
    }
Run Code Online (Sandbox Code Playgroud)

您可以看到变量usersLocation是硬编码的:

let usersLocation = {


            lat: 40.713744, 
            lng: -74.009056
        };
Run Code Online (Sandbox Code Playgroud)

我想到达真正的用户位置.

我见过Geolocation.getCurrentPosition()方法,但在这种情况下我不知道如何实现它.

谢谢

EDITED

 applyHaversine(locations){
        Geolocation.getCurrentPosition().then((resp) => {

        let  latitud = resp.coords.latitude
        let longitud = resp.coords.longitude
        }).catch((error) => {
          console.log('Error getting location', error);
        });

  console.log(this.latitud);
        let usersLocation = {

           lat:  this.latitud, 
           lng:  this.longitud 
        };
Run Code Online (Sandbox Code Playgroud)

ionic2 angular

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

在提示警报ionic-2中选择时间

我是离子-2的新手.我正在开发一个应用程序,用户必须在其中创建警报.为此,我创建了一个页面.该页面包含一个"+"按钮.单击该按钮时,将显示提示警报.截至目前,该提示警报有一个文本框和确定按钮.但是,而不是我需要显示日期时间选择器.我怎样才能做到这一点?任何帮助?

my html file:
<ion-header>
    <ion-navbar color="primary">
        <ion-title>Alarm</ion-title>
    </ion-navbar>
</ion-header>

<ion-content padding>
    <ion-fab right bottom>
        <button ion-fab (click)="alarm()" color="vibrant" mini>
            <ion-icon name="add"></ion-icon>
        </button>
    </ion-fab>
</ion-content>

my ts file:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

import { AlertController } from 'ionic-angular';

@Component({
  selector: 'page-wifi-controller-schedules',
  templateUrl: 'wifi-controller-schedules.html'
})
export class AlarmsPage {

  constructor(public navCtrl: NavController, public alertCtrl: AlertController) {}



  alarm() {
    let prompt = this.alertCtrl.create({
      title: 'Login',
      message: "Enter a name for this new album you're …
Run Code Online (Sandbox Code Playgroud)

ionic2 angular

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

离子2 - 获取window.scrollTop

如果没有jquery,我怎么能在Ionic中做到这一点?

  var window_top = jQuery(window).scrollTop() + 56;
  var div_top = jQuery('#sticky-anchor').offset().top;
Run Code Online (Sandbox Code Playgroud)

javascript typescript ionic2 ionic3 angular

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

包裹在离子行里面的词与离子2

我正在尝试在ion-col中配置自动换行,但我无法让它运行起来.

这是显示我的问题的图像:

图像显示文本覆盖

我想要做的是使重叠的部分下降到下一行.

以下是一切的结构:

<ion-item *ngFor="let visitante of visitantes">
  <ion-row wrap text-wrap>

    <ion-col width-50 text-wrap>
      Nome: {{ visitante.nome }}<br> <!-- this is what should go to the next line
      CPF : {{ visitante.cpf}}<br>
      Placa: {{ visitante.placa }}<br>
    </ion-col>

    <ion-col width-34>
      Liberado até:<br>
      {{ visitante.horaFim }}<br>
      {{ visitante.diaFim }}
    </ion-col>

    <ion-col width-10 text-right>
      <button ion-button icon-only>
        <ion-icon name="trash"></ion-icon>
      </button>
    </ion-col>

  </ion-row>
</ion-item>
Run Code Online (Sandbox Code Playgroud)

有谁知道为什么这不起作用?这不可能吗?

谢谢.

grid word-wrap ionic2

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

无法在Ionic 2项目中使用cordova文件插件读取文件

我正在尝试使用Cordova文件插件来读取保存在移动设备中的图像,这样我就可以获得它的base64编码,我需要远程存储它.问题是resolveLocalFilesystemUrl()方法,它应该提供一个File Entry对象,而不是似乎返回一个Entry对象,这意味着我无法调用它上面的文件.

下面是应该获取File Entry对象的代码,以便我可以使用file方法来读取文件本身.

MediaCapture.captureImage().then((images)=>{
  self.image = images[0].localURL;
  File.resolveLocalFilesystemUrl(self.image).then((entry)=>{
    entry.file(function (file) {
      var reader = new FileReader();

      reader.onloadend = function (encodedFile) {
        var src = encodedFile.target.result;
        src = src.split("base64,");
        var contentAsBase64EncodedString = src[1];
      };
      reader.readAsDataURL(file);
    })
  }).catch((error)=>{
    console.log(error);
  })
})
Run Code Online (Sandbox Code Playgroud)

我收到以下Typescript错误,它告诉我resolveLocalFilesystemUrl()正在使用Entry对象解析,该对象没有文件方法.(插件文档说resolveLocalFilesystemUrl使用File Entry对象解析,并且这样的对象肯定有一个提供文件本身的文件方法):

Property 'file' does not exist on type 'Entry'. 
Run Code Online (Sandbox Code Playgroud)

我已经尝试了我提供resolveLocalFilesystemUrl()的路径类型.我尝试了沿着/ var/mobile/Applications // Documents/path/to/file和cdvfile:// localhost/temporary/filename行的本地URL的完整路径 - 两者都不起作用

所以具体的问题是为什么不会解析LocalFilesystemUrl()为我提供一个文件入口对象,或者我是如何让它这样做的?更一般地说,如果上述方法不起作用,如何在Ionic 2中读取文件以便我可以获得它的base64版本.

谢谢!

base64 typescript cordova-plugins ionic2

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

Ionic 2文本不包含在选择组件中

这是我的HTML代码,但文本包装在某种程度上不适用于此选择组件.有人有想法吗?

<ion-list>
  <h5 color="primary">
    Choose:
  </h5>

  <ion-item text-wrap>
    <ion-select text-wrap class="selectWidth" okText="Ok" cancelText="Cancel" [selectOptions]="selectOptions" [(ngModel)]="Decision">
      <ion-option text-wrap selected="true" color="primary" value="vone" text-wrap>first first first first first</ion-option>
      <ion-option text-wrap color="primary" value="vtwo">second second second second second second second</ion-option>
      <ion-option text-wrap color="primary" value="vthree">third third third third third</ion-option>
    </ion-select>
  </ion-item>
</ion-list>
Run Code Online (Sandbox Code Playgroud)

html text word-wrap ionic2

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

导入moment.js

我按照这个例子如何在Ionic 2 RC5中导入和使用时刻.

但它无法找到该文件.我的improt在src/index.html中:

    <!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
  <meta charset="UTF-8">
  <title>Ionic App</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta name="format-detection" content="telephone=no">
  <meta name="msapplication-tap-highlight" content="no">

  <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
  <link rel="manifest" href="manifest.json">
  <meta name="theme-color" content="#4e8ef7">

  <!-- cordova.js required for cordova apps -->
  <script src="cordova.js"></script>


  <!-- un-comment this code to enable service worker
  <script>
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('service-worker.js')
        .then(() => console.log('service worker installed'))
        .catch(err => console.log('Error', err));
    }
  </script>-->

  <link href="build/main.css" rel="stylesheet">

</head>
<body>

  <!-- …
Run Code Online (Sandbox Code Playgroud)

angular-moment ionic2

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

使用cordova-plugin-file-transfer的文件上传无法在Android上运行,仅适用于iOS

有谁知道可能是什么问题?在过去的几周里,我一直试图弄清楚为什么我的代码仅适用于iOS,而不适用于Android设备.任何想法都会得到高度赞赏,因为我没有选择.

在Android设备上它显示发送文件但在服务器上我没有收到任何信息(图片也没有其他参数).另一方面,iOS上的所有工作都很好,服务器也是如此.

我的代码:

home.html的:

<button ion-button color="dark" (click)="takePhoto()">Open camera </button>
<img [src]="imageURL" *ngIf="imageURL" />
<br>imageURL={{imageURL}}
<br><button ion-button color="dark" (click)="upload()">Upload</button>
Run Code Online (Sandbox Code Playgroud)

home.ts:

@Component({
      selector: 'page-home',
      templateUrl: 'home.html'
})
export class HomePage {
    imageURL: any;
    myInput: string;
    cameraUrl: string;

    constructor(public navCtrl: NavController) {
    }

   takePhoto(){
       Camera.getPicture().then((imageData) => {
            this.imageURL = imageData;
       }, (err) => {
            console.log(err);
       });
   }
   upload(){
       var ft = new Transfer();
       var options = {
       fileKey: 'file',
       fileName: 'filename.jpg',
       params:{operatiune:'uploadpoza'}
   }
   ft.upload(this.imageURL,encodeURI("https://www.myserver.com/test.php"),options)
       .then((data) => {
            // success
            alert("image send:"+this.imageURL);
        }, …
Run Code Online (Sandbox Code Playgroud)

android cordova ionic2

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

如何在Ionic 2中使用Pipes(发布v2.2.1)

我想使用Pipe来对这里提供的一些数据进行排序.

以上看起来与角度文档一致,即我们有以下导入和类定义:

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

@Pipe({name: 'exponentialStrength'})
export class ExponentialStrengthPipe implements PipeTransform {
  transform(value: number, exponent: string): number {
    let exp = parseFloat(exponent);
    return Math.pow(value, isNaN(exp) ? 1 : exp);
  }
}
Run Code Online (Sandbox Code Playgroud)

所以,在上面我们从进口PipePipeTransform,然后我们从我们的派生类PipeTransform.

使用离子发生器,例如ionic g pipe testPipe我注意到不同的进口,并且它没有实现PipeTransform:

@Pipe({
  name: 'test-pipe'
})
@Injectable()
export class TestPipe {
  transform(value, args) {
    value = value + ''; // make sure it's a string
    return value.toLowerCase(); …
Run Code Online (Sandbox Code Playgroud)

typescript ionic2 angular

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