离子2:如果你关闭视图,你如何重新实现@ViewChild?

时间:2017-04-20 05:41:55

标签: javascript angular ionic2 angular2-template

我正在创建聊天体验,并且该页面通过使用来自离子角度上的内容的scrollToBottom方法来跟上对话。如果我从“PreChat.html”开始并转到“Chat.html”,那么我会关闭“Chat.html”以返回“PreChat.html”并再次返回“Chat.html”我收到以下错误: “无法读取属性'scrollToBottom'的null”。应该能够随时或重复地进行经验。

PreChat.html:

<ion-content>
  <button (click)="goToChat()" href="#">
    Chat
  </button>
</ion-content>

PreChat.ts:

import { Component } from '@angular/core';
import { ModalController } from 'ionic-angular';
import { Chat } from '../chat';

@Component({
  selector: 'preChat',
  templateUrl: 'preChat.html'
})
export class PreChat  {
   constructor(private modalCtrl: ModalController){}

   goToChat(): any {
    let profileModal = this.modalCtrl.create(Chat);
    profileModal.present();
  }
}

Chat.html:

<ion-content>
  <button ion-button="filter-button"(click)="dismiss()">
    <ion-icon name="close"></ion-icon>
  </button>
  <div *ngFor="let convo of conversationArray">
    <div class="b-text">{{convo.speak}}</div>
  </div>
</ion-content>

Chat.ts:

import { Component, ViewChild } from '@angular/core';
import { Content, Events, ViewController } from 'ionic-angular';

@Component({
  templateUrl: 'Chat.html'
})

export class Chat {
  @ViewChild(Content) content: Content;
  conversationArray: any[] = [];
  constructor(private events: Events, private viewCtrl: ViewController){
    this.events.subscribe('conversation', convo => {
      this.conversationArray = convo;
      this.content.scrollToBottom();
    })
  }
  dismiss() {
   this.viewCtrl.dismiss(); 
 }
}

2 个答案:

答案 0 :(得分:3)

您必须使用select * from my_function(123); 页面事件而不是ionViewDidEnter

  

页面完全进入后运行,现在是活动页面。这个   无论是第一次加载还是缓存页面,都会触发事件。

constructor

答案 1 :(得分:1)

请尝试以下方法:

this.content = this.ViewCtrl.getContent();