Question

我在<div>中有一个home.html，如下所示。我必须通过ID myDiv检索此元素，然后将其作为对JS方法的引用传递。我使用@ViewChild尝试了它，它在Ionic 2 beta 11中工作。将Ionic升级到最新的rc版本后，它已停止工作。

这是我的home.html

<ion-header>
  <ion-navbar>
    <ion-title>Home</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
  <div id="myDiv" #myDiv></div>
<ion-content>

这是我的home.ts：

import { Component, ViewChild, ElementRef} from '@angular/core';

import { NavController } from 'ionic-angular';


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})

export class HomePage {

    @ViewChild('myDiv') defaultContent: ElementRef;

    ngAfterViewInit() {
        // console.log("ngView");
        var myDiv: HTMLDivElement = this.defaultContent.nativeElement;
    }

    constructor(public navCtrl: NavController) {
    }

}

这是我的离子信息：

Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.1
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
ios-deploy version: 1.8.3 
ios-sim version: 5.0.4 
OS: Mac OS X El Capitan
Node Version: v6.8.0
Xcode version: Xcode 8.0 Build version 8A218a

Answer 1

你应该尝试开始使用更多angular2和typescript :)

public myDiv:string = '';


ngAfterViewInit() {
    // console.log("ngView");
    this.myDiv = this.defaultContent.nativeElement;
}

然后在你的HTML中

<div padding [innerHTML]="myDiv"></div>

在Ionic 2中通过id检索DOM元素

1 个答案: