在JavaScript文件中获取TempData返回变量而非值的问题

问题场景 #

控制器Action中赋值：

TempData["FromTask"] = true;

尝试在独立.js文件中读取时：

$(document).ready(function () {
    var data = '@TempData["FromTask"]';
    alert('data: '+ data);
});

弹窗显示data: @TempData["FromTask"]而非预期的data: true；去掉引号则直接报错。

原因 #

独立的.js文件不会被ASP.NET的Razor引擎解析，里面的Razor语法@TempData["FromTask"]会被当作普通字符串原样输出，无法替换为实际的TempData值。

解决方案 #

方案1：页面全局变量传递

在对应的Razor视图（.cshtml）中，先将TempData值存入全局变量，再让JS文件读取这个变量：

<!-- 在视图的<head>或<body>中添加 -->
<script>
    // 将TempData的字符串值转为布尔类型
    window.fromTaskFlag = '@TempData["FromTask"]' === 'True';
</script>
<!-- 引入你的JS文件 -->
<script src="/js/your-script.js"></script>

JS文件中读取全局变量：

$(document).ready(function () {
    var data = window.fromTaskFlag;
    alert('data: ' + data);
});

方案2：将JS代码嵌入Razor视图

如果这段JS逻辑仅服务于当前页面，直接把代码写在视图的<script>标签里，Razor引擎会自动解析@TempData语法：

<script>
$(document).ready(function () {
    // 布尔值无需加引号，Razor会直接解析为true/false
    var data = @TempData["FromTask"];
    alert('data: ' + data);
});
</script>

方案3：通过HTML元素的data属性传递

在视图的某个元素上设置data-*属性存储TempData值：

<body data-from-task="@TempData["FromTask"]">

JS文件中读取该属性并转换类型：

$(document).ready(function () {
    var dataStr = $('body').data('from-task');
    var data = dataStr === 'True';
    alert('data: ' + data);
});

内容的提问来源于stack exchange，提问作者user18048414