Создать ряд изображений без пробелов между использованием Razor

Question

Это похоже на этот пост , но я попробовал предложения там (кроме пользовательского помощника), и это не помогло.

Я пытаюсь создать ряд изображений в Razor, чтобы между ними не было пробела. Мой код вида Razor выглядит следующим образом. Модель является int.

    string theNumber = String.Format( "{0:00000}", Model );

    foreach( char theChar in theNumber.ToCharArray() )
    { 
<img src="/images/odometer/@{@theChar}.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
    }

Это создает HTML, который выглядит следующим образом.

        <img src="/images/odometer/0.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/0.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/1.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/9.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/7.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />

Что приводит к следующему отображению в браузере.

Разрывы строк в источнике HTML вызывают разрывы между изображениями. Что я действительно хочу, так это чтобы HTML генерировался на одной длинной строке, например так.

<img src="images/odometer/0.gif" style="border-width:0px;height:20px;width:15px;" /><img src="images/odometer/0.gif" style="border-width:0px;height:20px;width:15px;" /><img src="images/odometer/1.gif" style="border-width:0px;height:20px;width:15px;" /><img src="images/odometer/9.gif" style="border-width:0px;height:20px;width:15px;" /><img src="images/odometer/7.gif" style="border-width:0px;height:20px;width:15px;" />

Что приведет к изображению вроде.

Я знаю, что одним из вариантов было бы не использовать цикл. Мой номер всегда будет состоять из пяти цифр, поэтому вместо того, чтобы зацикливать каждый символ в строке, я мог бы просто написать тег img для каждой цифры.

Answer 1

Я считаю, что это работает:

@{
    var htmlTemplate = "<img src=\"/images/odometer/{0}.gif\" style=\"border-width: 0px;height: 20px;width: 15px;\" alt=\"\" />";
    string theNumber = String.Format("{0:00000}", DateTime.Now);
}
@foreach (char theChar in theNumber.ToCharArray())
{ 
    @Html.Raw(string.Format(htmlTemplate, theChar))
}

HTH

Answer 2

Если существует фиксированное количество цифр и рендеринг является проблемой, я бы либо отбросил foreach, либо попытался бы написать весь оператор в одной строке.