twp0217 / ngx-echarts

Apache ECharts component for Angular(基于 Angular 的 Apache ECharts 组件)
https://twp0217.github.io/ngx-echarts/
82 stars 25 forks source link

this.chart为空的问题 #14

Closed DennisDeng920525 closed 7 years ago

DennisDeng920525 commented 7 years ago

我在浏览器的resize事件中加了ng2-echart的resize事件,在浏览器中移动的时候ng2-echart的resize事件有生效,但是确报了Cannot read property 'resize' of null at EchartsNg2Component.resize。 内部的this.chart为null,不知道是什么原因。 image image

twp0217 commented 7 years ago

我这测试时正常的,能给我下你调用的ts文件吗

DennisDeng920525 commented 7 years ago

hr-chart.component.txt 单独只有一个tab页的时候不会有这个问题,但是我切换tab页回到之前的echart实例页面后会有这个问题。

twp0217 commented 7 years ago

你用的是什么tab组件

DennisDeng920525 commented 7 years ago

bootstrap的tabs

twp0217 commented 7 years ago

你用的是 https://github.com/ng-bootstrap/ng-bootstrap 的tab?

DennisDeng920525 commented 7 years ago

http://valor-software.com/ngx-bootstrap/#/ 用的这个下面的 import { TabsModule } from 'ngx-bootstrap/tabs'

twp0217 commented 7 years ago

你代码 image

要先判断echarts是否存在

//屏幕自适应
window.addEventListener('resize', function () {
  if(self && self.echarts){
    self.echarts.resize();
  }
})
DennisDeng920525 commented 7 years ago

这个之前我就有判断了 不行的。self.echarts都是存在的 但是进入到echarts-ng2.components.ts后this.chart为null. image

twp0217 commented 7 years ago

你页面有使用 *ngIf 吗?

DennisDeng920525 commented 7 years ago

有试过*ngIf="option" 也没用。 不知道你是指这么不?

twp0217 commented 7 years ago

不是,可以把工程发来看下吗? 无法重现你的问题,我也试了tab,但是是正常的

DennisDeng920525 commented 7 years ago

工程不是很方便发, 你能把你试过的tab项目发给我看下吗?

twp0217 commented 7 years ago

你直播把demo image 这个写进去,试下是否正常,demo的tab和你用的是一样的

DennisDeng920525 commented 7 years ago

这个问题解决了 是window.addEventListener引起的 改成宿主执行就可以了 image