javascript - 基于ViewBag显示Modal Error Message的PartialView

Question

我正在使用 SweetAlert 2 plugin 开发一个 MVC 5 应用程序.

我的目标:当我的应用程序中的任何地方发生错误时，我想显示一个带有标题/消息的(集中式，sweetalert)模式对话框。

我创建了一个名为“_ModalError”的 PartialView，并在我的主要共享“_Layout” View 的底部引用了它。基本上，每个页面都会启用此局部 View 。

然后我创建了一个简单的错误类...

namespace MyApp.Models
{
    public class MyError
    {
        public string ErrorTitle { get; set; }
        public string ErrorMessage { get; set; }
    }
}

我在想，每当我遇到错误时，我都会实例化一个新的 MyError 对象，设置适当的 ErrorTitle 和 ErrorMessage 属性，然后将 ViewBag.Error 设置为这个 MyError 对象。

private MyError err = new MyError();
err.ErrorMessage = "Your information was not valid. Please re-check everything.";
err.ErrorTitle = "Error!";
ViewBag.Error = err;

然后，在 javascript 中，每当加载 _ModalError(页面)时，它都会查看 ViewBag.Error 是否存在。如果是这样，则发生错误，因此显示它。这是我目前所拥有的......

<script>
    $(function() {
        if (@ViewBag.Error != null) {
            swal(
                @ViewBag.Error.ErrorTitle, 
                @ViewBag.Error.ErrorMessage,
                'error'
            );
    };
</script>

问题是，当页面第一次加载时，当它遇到 viewbag 代码时我得到这个错误...

Cannot perform runtime binding on a null reference.

我正在尝试访问 ViewBag 但显然它一开始并不存在，这是有道理的。但是，检查它是否为 null 并没有真正起作用。你知道这是为什么吗？有什么建议么？这是一个错误的、疯狂的或过度杀戮的解决方案吗？

********* 解决方案 ********

这是解决方案。感谢 Stephen Muecke(下图)提供的 Json.Encode 建议!我希望这对其他人有帮助!

<script>
$(function() {
    var error = @Html.Raw(Json.Encode(ViewBag.Error));
    if (error != null) {
        swal(
            error.ErrorTitle,
            error.ErrorMessage,
            'error'
        );
    }
})

Answer 1

问题是 Razor 代码在发送到 View 之前在服务器上被解析，所以 @ViewBag.Error.ErrorTitle, 和 @ViewBag.Error.ErrorMessage在服务器上进行评估，如果 @ViewBag.Error 为 null，则抛出异常，因为您无法访问 null 对象的属性. (它不会仅仅因为它在 javascript if 语句中就停止对其求值——那是客户端代码，而且此时甚至不存在)

相反，将 Error 对象分配给一个 javascript 对象，然后在您的 if block 中测试它

$(function() {
    // Assign to a javascript variable
    var error = @Html.Raw(Json.Encode(ViewBag.Error))
    if (!error) {
        swal(
            error.ErrorTitle, 
            error.ErrorMessage,
            'error'
        );
    }
}

您还应该考虑使用包含 Error 对象的基本 View 模型，而不是在 ViewBag 属性中传递它。