Wie rendere ich mit Razor einen booleschen Wert in eine JavaScript-Variable?

Lesezeit: 3 Minuten

Benutzer-Avatar
Nikos

Wie rendere ich einen booleschen Wert für eine JavaScript-Variable in einer CSS-Datei?

Derzeit zeigt dies einen Syntaxfehler:

<script type="text/javascript" >

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

Benutzer-Avatar
Ein anderer Benutzer

Vielleicht möchten Sie auch Folgendes versuchen:

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

und ein immer besserer Weg ist die Verwendung von:

isFollowing: @Json.Encode(Model.IsFollowing)

  • @Json.Encode(Model.IsFollowing) ist imho die eleganteste lösung. Vielen Dank!

    – Sandro

    16. April 2014 um 14:42 Uhr

  • Normalerweise wird mehr als ein boolescher Wert verwendet, in diesem Fall macht die Kodierung des gesamten Modells die Dinge danach schön und einfach zu verwenden. z.B: var model = @Html.Raw(Json.Encode(Model)); und dann kannst du einfach anrufen model.IsFollowing (Entschuldigung, ich weiß nicht, wie man den Kommentarcode richtig formatiert)

    – Jynn

    13. April 2017 um 9:06 Uhr


  • Hinzufügen @using System.Web.Helpers um den Code zu vervollständigen.

    – Taylorswiftfan

    21. April 2020 um 19:11 Uhr

Weil mich eine Suche hierher geführt hat: in ASP.NET Core, IJsonHelper hat keine Encode() Methode. Verwenden Sie stattdessen Serialize(). Z.B:

isFollowing: @Json.Serialize(Model.IsFollowing)    

  • Vielen Dank für die Erwähnung von asp.net core!

    – Sharif Mamun

    11. Dezember 2017 um 17:43 Uhr

Der boolesche JSON-Wert muss in Kleinbuchstaben geschrieben werden.

Probieren Sie daher dies aus (und stellen Sie sicher, dass Sie die // Kommentar zur Zeile):

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

Oder (Hinweis: Sie müssen den Namensraum verwenden System.Xml):

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

  • Der .ToString()-Ansatz ist wahrscheinlich der effizienteste. Die Verwendung von ‘@Model.IsFollowing.ToString().ToLowerInvariant()’ muss etwas effizienter und etwas einfacher sein.

    – XDS

    6. Februar 2017 um 8:44 Uhr

  • Die Verwendung der Methode zum Stringen und Senken ist definitiv die sauberste in meiner Option, da sie sich gut in Javascript liest.

    – Frank Thomas

    20. April 2020 um 15:13 Uhr

Benutzer-Avatar
gdoron unterstützt Monica

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

Warum True und nicht true Sie fragen … Gute Frage:
Warum gibt Boolean.ToString “True” und nicht “True” aus

Eine einfacher zu lesende Lösung wäre dies:

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

Benutzer-Avatar
Stuart Hallows

Hier ist eine weitere Option, die Sie in Betracht ziehen sollten, indem Sie das !! Umwandlung in boolesch.

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

Dadurch wird auf der Clientseite Folgendes generiert, wobei 1 in wahr und 0 in falsch umgewandelt wird.

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

Benutzer-Avatar
Allgemeine Beschwerde

Definieren einer Konvertierungsoperation und Hinzufügen einer Überschreibung von .ToString() kann viel Arbeit sparen.

Definieren Sie dies struct in deinem Projekt:

/// <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();
}

Verwendungszweck

Sie können ein C# direkt umwandeln boolwie im Fall der Frage:

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

Du kannst aber auch a verwenden JSBool direkt im Razor-Code mit der Erwartung, dass es geben wird true und false ohne zusätzliche Arbeit:

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

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

Dies funktioniert aufgrund der oben definierten impliziten Konvertierungsoperatoren.


Stellen Sie nur sicher, dass Sie dies nur dann verwenden, wenn Sie beabsichtigen, es in Razor-Code zu verwenden. Mit anderen Worten, verwenden Sie es nicht mit normalem C#, da dies Ihren Code unordentlich machen kann.

1284030cookie-checkWie rendere ich mit Razor einen booleschen Wert in eine JavaScript-Variable?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy