javascript - 如何声明要在 onClick 事件中使用的动态 TypeScript 对象名称？

Question

假设我有一个 TypeScript 对象，我在 View 中的某个位置声明了它:

<script type="text/javascript">
    var myTSObject = Module.CustomClass('#someId');
    myISObject.bind();
</script>

现在我需要处理来自包含 <script> 的元素内部某处的点击。标签:

<div id="thisDiv">
    <script type="text/javascript">
        var myTSObject = Module.CustomClass('#thisDiv');
        myISObject.bind();
    </script>
    <button onClick="myISObject.handleClick()" />
</div>

到目前为止一切顺利，但是如果我使用上面的 <div>...</div> 会怎样？ block 作为模板，因此当生成我的 View 时，它看起来像这样:

<div id="thisDiv">
    <script type="text/javascript">
        var myTSObject = Module.CustomClass('#thisDiv');
        myISObject.bind();
    </script>
    <button onClick="myISObject.handleClick()" />
</div>
<div id="thatDiv">
    <script type="text/javascript">
        var myTSObject = Module.CustomClass('#thatDiv');
        myISObject.bind();
    </script>
    <button onClick="myISObject.handleClick()" />
</div>

这会失败，这是可以理解的，因为现在第二个 myISObject 覆盖了第一个 myISObject。但由于<div>...</div> block 是一个模板，我无法硬编码 JS 变量名称。如何相应处理？

Answer 1

将其设置在页面顶部:

var divnumber=0;

然后对每个 div 使用它:

divnumber++;
window['myISObject' + divnumber] = ...