我是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) 我是离子-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) 如果没有jquery,我怎么能在Ionic中做到这一点?
var window_top = jQuery(window).scrollTop() + 56;
var div_top = jQuery('#sticky-anchor').offset().top;
Run Code Online (Sandbox Code Playgroud) 我正在尝试在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)
有谁知道为什么这不起作用?这不可能吗?
谢谢.
我正在尝试使用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版本.
谢谢!
这是我的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) 我按照这个例子如何在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) 有谁知道可能是什么问题?在过去的几周里,我一直试图弄清楚为什么我的代码仅适用于iOS,而不适用于Android设备.任何想法都会得到高度赞赏,因为我没有选择.
在Android设备上它显示发送文件但在服务器上我没有收到任何信息(图片也没有其他参数).另一方面,iOS上的所有工作都很好,服务器也是如此.
我的代码:
home.html的:
Run Code Online (Sandbox Code Playgroud)<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>
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) 我想使用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)
所以,在上面我们从进口Pipe和PipeTransform,然后我们从我们的派生类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)