如何通过JS更改<ion-input> </ion-input>元素的输入值

时间:2016-04-21 04:15:04

标签: javascript element ionic2

我试图通过JS为我的离子输入元素赋值。这是我的代码:

HTML:

<ion-input type="text" placeholder=" Enter a location" style="padding-left: 10px;" id="geolocation"></ion-input>

JAVASCRIPT:

function onSuccess(position) {
        var element = document.getElementById('geolocation').value = position.coords.latitude  + ',' + position.coords.longitude;
        //element.value =  position.coords.latitude  + ',' + position.coords.longitude + element.value;

    }

我无法更改输入元素的值,我想将position.coords.latitude +','+ position.coords.longitude作为我的输入元素的值。

希望快速回答​​。谢谢!

3 个答案:

答案 0 :(得分:1)

尝试类似:

[(ngModel)]="position.coords.latitude  + ';' + position.coords.longitude"

Dom操作会起作用,但这不是正确的方法,看看如何使用下面的解决方案:

HTML

<ion-input type="text" placeholder=" Enter a location" style="padding-left: 10px;" id="geolocation" [(ngModel)]="position.coords.latitude  + ';' + position.coords.longitude"></ion-input>

使用Javascript:

...

export class Geolocation {

   //{ position : { coords : { latitude : ... , longitude : ... } } }
   position : any;

   ...
}

答案 1 :(得分:0)

假设您以数组形式正确接收纬度和经度,代码应如下所示:

function onSuccess(position) {
        document.getElementById('geolocation').setAttribute("value", latitude + ', ' + longitude);
}

在此测试:https://jsfiddle.net/nabtron/qy96n44k/

<强>解释

这里我们只是通过使用其Id来调用元素,并按照此处的说明设置其属性值:https://nabtron.com/javascript-tips/

答案 2 :(得分:0)

试试这个。

document.getElementById("geolocation").value=
     (position.coords.latitude  + ',' + position.coords.longitude);