将 ViewBag 数据传递给 requirejs 或 knockout

Question

我是 js 的新手，现在正在尝试将 HTML5 AJAX File Uploader Module 集成到我的 ASP.NET MVC 项目中。

在我的项目中，有一个 ViewBag.UserID，在视图中我使用了模块中的脚本：

<script type="text/javascript" data-main="/scripts/main" src="/Scripts/require.js"></script>

我想我可以使用上面的脚本将 UserID 传递给 main.js，这样我就可以使用类似

的东西

var UserID;

html5Upload.initialize({
    // URL that handles uploaded files
    uploadUrl: '/file/upload?Userid=' + UserID,

    ...
    });

但是...我该怎么做才能实现它？

Answer 1

您可以使用一些引导代码将服务器端全局变量集成到您的 javascript 中。例如：

<script>
(function(myNamespace) {
  "use strict";

  myNamespace.UserInfo = {
    UserID: '@ViewBag.UserID' // injects viewbag info into javascript
  };

}(window.myNamespace = window.myNamespace || {}));
</script>

现在您拥有的 javascript 的任何位都可以访问全局 myNamespace 变量的 UserInfo 属性，其中包含 viewbag 数据。例如：

uploadUrl: '/file/upload?Userid=' + myNamespace.UserInfo.UserID,

Answer 2

@Jeroen 的建议很正确。然而，这里有另一种方法可能对你的目的来说有点矫枉过正，但你也可以在许多其他地方使用它： SuperScript 是一个库，它允许你声明，例如，服务器中的 JavaScript 变量-side 代码，并根据需要将该变量 emitted 到输出网页。

所以在你的情况下你可以有类似

的东西

SuperScript.JavaScript.Declarations.AddVariable(opt => opt.EmitterKey("javascript")
                                                          .Name("user_id")
                                                          .Value(UserID));

在你的 Razor 视图/_layout

@SuperScript.Declarations.EmitFor("javascript")

哪个会写出来

var user_id = "...";    // the string value of UserID

除了此解决方案背后的可扩展性之外，它还允许您避免在不存在 ViewBag 属性的共享视图中出现错误，并提供一种轻松地将 values/objects 从代码移动到前端的方法。

免责声明：我是 SuperScript 的开发者之一。

将 ViewBag 数据传递给 requirejs 或 knockout

Pass ViewBag data to requirejs or knockout

javascript

asp.net-mvc

knockout.js

requirejs

viewbag