Javascript в движке Razor

Question

У меня есть следующий JavaScript:

<script type="text/javascript">
    function doReveal() {
        if (@Model.C1 == true) {
            document.getElementById('A1').style.backgroundColor = 'yellow';
        }
        if (@Model.C1 == false) {
            document.getElementById('A1').style.backgroundColor = 'yellow';
        }
</script>

Я хотел сделать так, чтобы функция doReveal проверила Model.C1 (который является логическим значением) и затем изменила цвет фона, если он был истинным.

Однако я получаю сообщение о том, что «условная компиляция выключена», и зеленое вихревое движение под Model.C1, а также цвет фона никогда не меняются, даже когда у меня есть и истина, и ложь.

Я проверил линию смены фона, которая работает за пределами "если".

Глядя на страницу источника, я вижу это:

if (True == true) document.getElementById('A1').style.backgroundColor = 'yellow';

Я изменил его и удалил == true, но он все равно не работает. Даже следующее не работает. Тем не менее, это работает, я удаляю «if (True)» и просто устанавливаю цвет.

if (True) document.getElementById('A1').style.backgroundColor = 'yellow';

Кто-нибудь знает, что может быть не так?

Answer 1

Знак запуска кода бритвы должен находиться перед оператором if.В противном случае движок считает, что if является частью кода javascript, а не бритвой.Также я думаю, что вам понадобятся бритвенные текстовые маркеры

      <script type="text/javascript">
            function doReveal() {
                @if (Model.C1 == true) {
<text>
                    document.getElementById('A1').style.backgroundColor = 'yellow';
</text>
                }
                @if (Model.C1 == false) {
                    document.getElementById('A1').style.backgroundColor = 'yellow';
                }
        </script>

Другой случай, когда вы хотите выполнить оператор if в JavaScript, а не на стороне сервера.В этом случае ваша разметка бритвы является corect, но сгенерированный код будет выглядеть как

    <script type="text/javascript">

    function doReveal() {

        if (False == true) {

            document.getElementById('A1').style.backgroundColor = 'yellow';

        }

        if (False == false) {

            document.getElementById('A1').style.backgroundColor = 'yellow';

        }

</script>

False не равно true, равно как и false.(javascript чувствителен к регистру).То же самое для True.Итак, ваш оператор if не будет выполнен.

Answer 2

Важно понимать, что что-то подобное , а не заставит вашу страницу динамически изменять цвета фона в ответ на изменение значений модели, поскольку ASP.NET запускается на сервере во время построения страницы, в то время как JavaScript запускается в браузере после создания и загрузки страницы.

Имея это в виду, если вы просто хотите изменить цвет фона, который появляется при загрузке страницы, лучше подойдет следующее:

@if (Model.C1) {
    <div id="A1" style="background-color: yellow;"></div>
} else {
    <div id="A1" style="background-color: blue;"></div>
}