angular - Maximum call stack size exceeded (Angular8)
问题描述
I'm Trying to do the below in Angular, I can't understand where is the problem? understand that this is a recursive function but in javascript there is a lot of workarounds to solve this, I tried them here but they did not work out do you have any work around for this?
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.scss']
})
export class HeaderComponent implements OnInit {
constructor() {}
changeImg = () => {
let i = 0;
const time = 1000;
const images = [
'../../assets/imgs/dashboard_full_1.webp',
'../../assets/imgs/dashboard_full_2.webp'
];
document.slide.src = images[i];
if (i < images.length - 1) {
i++;
} else {
i = 0;
}
setTimeout(this.changeImg(), time);
};
ngOnInit() {
this.changeImg();
}
}
解决方案
Your problem is here:
setTimeout(this.changeImg(), time);
You are invoking this.changeImg()
which invokes this.changeImg()
which then invokes this.changeImg()
and on and on until Angular gets bored of you and crashes your app.
If the call stack size error hadn't occurred you'd be passing the result of this.changeImg()
to setTimeout
, instead of passing a reference to a function as expected.
Simply remove the invocation.
setTimeout(this.changeImg, time);
推荐阅读
- javascript - Chart.js 图表不开始于
- css - Flex + svg 在 ios Safari 14.0.3 中表现奇怪
- excel - 自动打开并运行 Excel 宏
- wrapper - 请求历史柱数据时,盈透证券交易平台 API keepUpToDate 函数究竟返回什么?
- laravel - barryvdh/laravel-dompdf 在下载时不显示刀片文件的内容
- python - auto arima 在动态图上给出 inf 结果,我该怎么办?
- r - 为什么 scale_fill_virdis 会覆盖 scale_fill_discrete?
- reactjs - 带有 React 的模态滑块
- impala - 在 impalad Web UI 上关闭飞行中的打开会话失败
- python - 在 requests-html 渲染后执行 Javascrpt