ionic-framework – 如何从Ionic2中的离子输入中获取包裹的输入

发布时间：2020-12-17 17:35:14 所属栏目：安全来源：网络整理

导读：我想将google.maps.places.Autocomplete附加到离子输入,但在Ionic2离子输入中包含 input元素,我无法弄清楚如何访问它. 我已经尝试创建一个指令并使用传入的ElementRef import {Directive,ElementRef,Input} from 'angular2/core';@Directive({ selector: '[l

我想将google.maps.places.Autocomplete附加到离子输入,但在Ionic2离子输入中包含< input>元素,我无法弄清楚如何访问它.

我已经尝试创建一个指令并使用传入的ElementRef

import {Directive,ElementRef,Input} from 'angular2/core';

@Directive({
    selector: '[location-picker]'
})

export class LocationPicker {
    constructor(el: ElementRef) {    
        console.log(el.nativeElement);    
    }
}

但nativeElement返回包装的输入.

<ion-input location-picker="">
    <input class="text-input ng-valid ng-dirty ng-touched" type="text" placeholder="" aria-labelledby="lbl-6" location-picker="" autocomplete="off" autocorrect="off">
    <!--template bindings={}-->
    <!--template bindings={}-->
    <!--template bindings={}-->
</ion-input>

我也尝试创建类似于this的自定义组件并将Searchbar切换到TextInput,但TextInput没有.inputElement`.

任何想法都会受到欢迎.

谢谢！

解决方法

不确定这是你想要的(不知道离子)

<ion-input location-picker="">
    <input #myInput class="text-input ng-valid ng-dirty ng-touched" type="text" placeholder="" aria-labelledby="lbl-6" location-picker="" autocomplete="off" autocorrect="off">
    <!--template bindings={}-->
    <!--template bindings={}-->
    <!--template bindings={}-->
</ion-input>

@ViewChild('myInput') input; 

ngAfterViewInit() {
  console.log(this.input.nativeElement.value);
}

另见angular 2 / typescript : get hold of an element in the template

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!