javascript - 使用 Razor，如何将布尔值呈现给 JavaScript 变量？

Question

如何将布尔值呈现为 cshtml 文件中的 JavaScript 变量？

目前这显示了一个语法错误：

<script type="text/javascript" >

    var myViewModel = {
        isFollowing: @Model.IsFollowing  // This is a C# bool
    };
</script>

Answer 1

您可能还想尝试：

isFollowing: '@(Model.IsFollowing)' === '@true'

更好的方法是使用：

isFollowing: @Json.Encode(Model.IsFollowing)

Answer 2

因为一次搜索把我带到了这里：在 ASP.NET Core 中，IJsonHelper没有Encode()方法。相反，使用Serialize(). 例如：

isFollowing: @Json.Serialize(Model.IsFollowing)    

Answer 3

JSON 布尔值必须为小写。

因此，试试这个（并确保 nto//在行上有注释）：

var myViewModel = {
    isFollowing: @Model.IsFollowing.ToString().ToLower()
};

或者（注意：您需要使用命名空间System.Xml）：

var myViewModel = {
    isFollowing: @XmlConvert.ToString(Model.IsFollowing)
};

Answer 4

var myViewModel = {
    isFollowing: '@(Model.IsFollowing)' == "True";
};

为什么True而不是true你问...好问题：
为什么 Boolean.ToString 输出“真”而不是“真”

Answer 5

一个更容易阅读的解决方案是这样做：

isFollowing: @(Model.IsFollowing ? "true" : "false")

Answer 6

这是另一个需要考虑的选项，使用 !! 转换为布尔值。

isFollowing: !!(@Model.IsFollowing ? 1 : 0)

这将在客户端生成以下内容，将 1 转换为 true，将 0 转换为 false。

isFollowing: !!(1)  -- or !!(0)

Answer 7

定义一个转换操作并添加一个覆盖.ToString()可以节省很多工作。

struct在你的项目中定义这个：

/// <summary>
/// A <see cref="bool"/> made for use in creating Razor pages.
/// When converted to a string, it returns "true" or "false".
/// </summary>
public struct JSBool
{
    private readonly bool _Data;

    /// <summary>
    /// While this creates a new JSBool, you can also implicitly convert between the two.
    /// </summary>
    public JSBool(bool b)
    {
        _Data = b;
    }

    public static implicit operator bool(JSBool j) => j._Data;
    public static implicit operator JSBool(bool b) => new JSBool(b);

    // Returns "true" or "false" as you would expect
    public override string ToString() => _Data.ToString().ToLowerInvariant();
}

用法

您可以直接转换 C# bool，如问题所示：

{
    // Results in `isFollowing : true`
    isFollowing : @((JSBool)Model.IsFollowing)
}

但是您也可以JSBool直接在 Razor 代码中使用 a 并期望它会提供true并且false无需做任何额外的工作：

@{
    JSBool isA = true;
    JSBool isB = false;
    // Standard boolean operations work too:
    JSBool isC = a || b;
}

<script>
    if (@isC)
        console.log('true');
</script>

这是因为我们上面定义的隐式转换运算符。

---

只需确保仅在您打算在 Razor 代码中使用它时才使用它。换句话说，不要将它与普通的 C# 一起使用，因为这会使您的代码变得混乱。