动态变量名称 javascript MVC

Dynamic variable names javascript MVC

本文关键字：MVC javascript 变量名 动态      更新时间：2023-09-26

我正在循环运行一些javascript代码，创建一个图表（使用谷歌可视化）。运行所有这些代码后，我需要在其他地方访问这些对象。我的问题是我不能再次调用"图表"，因为它现在已经被覆盖了。

我已经设法找出了一个非常黑客的解决方案，它涉及使用 MVC @ thing在运行时动态生成一些东西，然后我强制将其作为变量名称。它有效，但我认为这不是解决这个问题的正确方法。有没有办法让我在每次运行时动态更改变量的名称？

以下代码将运行多次。 

@{
var myChart = "cData" + Model.ChartId.ToString();
}
...
function () {
    @myChart = new google visualization.ChartWrapper({ ... }); 
    dashboard.bind(slider, @myChart);
    dashboard.draw(data); 
}

myChart 每次运行代码时都会更改，这给了我一个非常糟糕的字符串。通过不带 ' 标记，它在运行时成为一个变量。运行完所有这些后，我有一个调整大小函数，它运行以下内容： 

@myChart .setOption('width', width);
@myChart .setOption('height', height);
@myChart .draw();

这也超级笨拙。我利用了javascript忽略空格的优势，这样我就可以像对待对象一样对待@myChart。

结果充满了语法错误，但它仍然运行，并且以预期的结果运行。所以我的问题是是否有一个"适当的"解决方案，而不是为我需要制作的每个单独的图表制作单独的 javascript 函数。

谢谢。

你所做的没有错，但它可能会更好。

首先，你不必依赖空间来混合JavaScript和Razor。

@(myChart).setOption('width', width);

但这仍然很丑陋。

方法1

<script>
    // global (usual caveats about globals apply)
    var charts = {};
</script>
@for( int i = 0; i < 10; i++ )
{
    string chartId = "chart-" + i;
    <script>
        charts['@chartId'] = new Chart();
        charts['@chartId'].setOption('width', width);
        charts['@chartId'].setOption('height', height);
        charts['@chartId'].draw();
    </script>
}

方法2

<script>
    function doResize(chart) {
        chart.setOption('width', width);
        chart.setOption('height', height);
        chart.draw();
    }
</script>
@for( int i = 0; i < 10; i++ )
{
    <script>
        (function () {
            // limit the scope of the "chart" variable
            var chart = new Chart();
            // perform other init
            // listen for resize in some manner
            $(window).on("resize", function() {
                doResize(chart);
            });
        })();
    </script>
}
方法

#2是我的首选方法，因为它管理范围并且易于阅读。

相关文章：