JavaScript is not playing nice with boolean false

Question

Asp.net mvc / jQuery / JavaScript

 

In my partial view, I have a model that has boolean properties that I will pass to JavaScript functions.

 

 

I pass the model boolean properties to JavaScript functions as such.

@model GbngWebClient.Models.LikeOrDislikeVM

<style>
.fa {
    cursor: pointer;
    user-select: none;
}

    .fa:hover {
        color: blue;
    }

/* I added. */
.my-size {
    font-size: 20px;
}
</style>

@* Use the values that were passed via a model. *@
<div class="row">
<p><span class="blogLike my-size fa fa-thumbs-up"></span><span class="my-size"> : @Model.LikeCount</span> <span class="my-size"> | </span><span class="blogDisLike my-size fa fa-thumbs-down"></span><span class="my-size"> : @Model.DisLikeCount</span></p>
</div>

@Scripts.Render("~/bundles/jquery")

<script type="text/javascript">
$(document).ready(function () {
    console.log('Here at document ready');
    console.log('@Model.LikeDisabled');
    console.log('@Model.DisLikeDisabled');

    SetLike('@Model.LikeDisabled');
    SetDisLike('@Model.DisLikeDisabled');

    function SetLike(disabledSwitch) {
        console.log('Here at SetLike');
        console.log('disabledSwitch ' + disabledSwitch);

        $(".blogLike").attr('disabled', disabledSwitch);

        if (disabledSwitch == false )
        {
            console.log('True');
            $(".blogLike").color('green');
        }
    }

    function SetDisLike(disabledSwitch) {
        console.log('Here at SetDisLike');
        console.log('disabledSwitch ' + disabledSwitch);

        $(".blogDisLike").attr('disabled', disabledSwitch);

        if (disabledSwitch == false)
        {
            console.log('True');
            $(".blogDisLike").color('green');
        }
    }
});
</script>

The code executes but the boolean values are False instead of false. Yet the model screenshot above shows them as false.

 

JavaScript needs them to be false. Why is this happening and how to fix?