如何从Ionic2中的离子输入中获取包裹的输入？

Question

我想附加一个google.maps.places.Autocomplete到ion-input,但在Ionic2 ion-input包装的<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>

我还试图建立类似一个自定义组件这和切换Searchbar到TextInput,但TextInput doesn't have.inputElement`.

任何想法都会受到欢迎.

谢谢!

Answer 1

不确定这就是你要找的（不知道 Ionic）

<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 ：获取模板中的元素