简体   繁体   English

Ionic v2-如何知道前端何时完成渲染?

[英]Ionic v2 - How to know when front-end finish rendering?

How to know when front-end finish rendering? 如何知道前端何时渲染?

I mean, you have an Array of something on your backend and a ngFor on your view. 我的意思是,您的后端有一个数组,视图上有一个ngFor。

How can I know when that's finish? 我怎么知道什么时候结束? I want to know because I need to scroll down when it's finish, and currently it scrolls before it renders. 我想知道,因为我需要在完成时向下滚动,并且当前它在呈现之前会滚动。

Here's some code to demostrate the problem: https://gist.github.com/mtnoronha/e78eba6b610b71f1e72424ed21722be1 这是一些用于演示该问题的代码: https : //gist.github.com/mtnoronha/e78eba6b610b71f1e72424ed21722be1

Thank you 谢谢

Create a new promise to handle when it has finished loading the messages so you need to scroll to bottom, in your case use it like this: 创建一个新的promise,以在完成加载消息后进行处理,因此您需要滚动到底部,在这种情况下,请像下面这样使用它:

YOUR .TS FILE 您的.TS文件

appendRows(newData){
if(!newData || newData.length == 0)
  return;
  this.myNewPromise().then(res =>{
    if(res){
      this.content.scrollToBottom(0);
    }
  })
}

myNewPromise = (): Promise<boolean> =>{
  return new Promise<boolean>(res){
    if(this.messages){
      let newArray = this.messages.concat(newData);
      this.messages = newArray;
      res(true);
    }else{
      this.messages = newData;
      res(false);
    }
  }
}

So your scrollToBottom will only fire when myNewPromise finishs. 因此,只有在myNewPromise完成时才会触发您的scrollToBottom In your promise you resolve it and return a boolean, so if there's new message you call the scrollToBottom . 在您的承诺中,您将解决该问题并返回一个布尔值,因此,如果有新消息,请调用scrollToBottom

If you need to call it either way, just pass a true in both res or remove the if (res) on the return of myNewPromise . 如果您需要以任何一种方式调用它,只需在两个res传递true或在myNewPromise返回时删除if (res)

Hope it helps. 希望能帮助到你。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM