ASP MVC цветная строка в Html.Raw - PullRequest
Новая
       12

ASP MVC цветная строка в Html.Raw

0 голосов
/ 23 апреля 2019

Я хочу сравнить две строки.Существуют ли различия в каждом index, я хочу покрасить этот конкретный char в красный (если не совпадает) или в зеленый (если он совпадает). 

            <li>
                @for (int i = 0; i < item.AnswersList.Count; i++)
                {
                    var answerArray = item.AnswersList[i].Output.ToArray();
                    var outputArray = item.OutputList[i].Output.ToArray();

                    for (int j = 0; j < answerArray.Length; i++)
                    {
                        if (answerArray[j] == outputArray[j])
                        {
                            @Html.Raw( How to print colorful char here?);
                        }
                    }
                }
            </li>

Этот цветной string необходимобыть в одной строке в теге <li>.

РЕДАКТИРОВАТЬ:

Я сделал это изменение в свой код: 

<div style="color: green;">
     @Html.Raw(outputArray[j])
</div>

Но я получаювыведите вот так:

enter image description here

Как сделать это одним словом в теге <li>?

Ответы [ 3 ]

1 голос
/ 23 апреля 2019

Надеюсь, вам нужно это: 

       <li>
            @for (int i = 0; i < item.AnswersList.Count; i++)
            {
                var answerArray = item.AnswersList[i].Output.ToArray();
                var outputArray = item.OutputList[i].Output.ToArray();

                for (int j = 0; j < answerArray.Length; i++)
                {
                    bool isMatch = answerArray[j] == outputArray[j];
                    <div style="color: @(isMatch ? "green" : "red");">
                        @Html.Raw(outputArray[j])
                    </div>
                }
            }
        </li>

UPD : если вам нужны все символы в одном ряду, используйте span вместо div.

UPD2: Попробуйте это (интервал, но без новой строки): 

<span style="color: @(isMatch ? "green" : "red");margin:0;padding:0">@Html.Raw(outputArray[j])</span>
1 голос
/ 23 апреля 2019

Это должно работать отлично. Нужно просто убедиться, что вы не оставляете пробелы вокруг тегов <span>, например: 

<li>
    @for (int i = 0; i < item.AnswersList.Count; i++)
    {
        var answerArray = item.AnswersList[i].Output.ToArray();
        var outputArray = item.OutputList[i].Output.ToArray();

        for (int j = 0; j < answerArray.Length; i++)
        {
            if (answerArray[j] == outputArray[j])
            {<span style="color:green">@Html.Raw(outputArray[j])</span>}
            else
            {<span style="color:red">@Html.Raw(outputArray[j])</span>}
        }
    }
</li>
1 голос
/ 23 апреля 2019

Попробуйте следующее: 

<li style="display: flex;>
   @for (int i = 0; i < item.AnswersList.Count; i++)
   {
      var answerArray = item.AnswersList[i].Output.ToArray();
      var outputArray = item.OutputList[i].Output.ToArray();

      for (int j = 0; j < answerArray.Length; i++)
      {
         if (answerArray[j] == outputArray[j])
         {
            <span style="color: green;">
              ...
            </span>
         }
      }
   }
</li>
...