调用方法形式setInterval()导致异常

时间:2014-06-29 14:57:06

标签: typescript this

我想从setInterval()调用函数。这是一个想法:

class Greeter {
    element: HTMLElement;
    span: HTMLElement;
    timerToken: number;

    constructor(element: HTMLElement) {
        this.element = element;
        this.element.innerHTML += "The time is: ";
        this.span = document.createElement('span');
        this.element.appendChild(this.span);
        this.span.innerText = new Date().toUTCString();
        //this.element.style.cssText = "-webkit-transform:rotate(7deg)";     
        //this.element.style.transition = "-webkit-transform: rotate(180deg)";         
    }

    start() {
        this.timerToken = setInterval(this.runningLoop(this.element), 500);        
    }

    stop() {
        clearTimeout(this.timerToken);
    }

    runningLoop(element: HTMLElement) {
        this.element.style.cssText = "-webkit-transform:rotate(7deg)";         
    }


}

window.onload = () => {
    var el = document.getElementById('content');
    var greeter = new Greeter(el);

    greeter.start();
};        

在这种情况下,我得到一个例外:

  

第13行第9行的未处理异常.Microsoft JScript运行时错误:参数无效。

所以我尝试了如下:

this.timerToken = setInterval(function () { this.runningLoop(this.element) }.bind, 500);

没有例外,但没有任何反应......

有什么想法吗?

2 个答案:

答案 0 :(得分:18)

setInterval(this.runningLoop(this.element), 500);

上述内容在将this.runningLoop传递给setInterval之前调用setIntervalundefined期待一个函数但正在接收setInterval(() => this.runningLoop(this.element), 500); 。用箭头功能包裹呼叫......

runningLoop

由于您未在setInterval中使用元素参数,因此可以删除参数并将方法传递给setInterval(this.runningLoop, 500); ...

{{1}}

答案 1 :(得分:0)

这将在您想要的时间循环: setInterval(()=> function(),以毫秒为单位的时间);

现在,如果你想随时停下来!在间隔之前写一个var: 在TS文件的顶部声明: varInterval:any; this.varInterval = setInterval(()=> function(),以毫秒为单位的时间);

您可以像这样调用方法停止: clearInterval(this.varInterval);

这项工作适合我!