Angular JS: встроенный стиль со связанным значением работает на Mac, а не на Windows

0

Я построил таблицу с ng-repeat, показывающую спецификации типа для проекта со столбцом "образцы":

Изображение 174551

Как вы можете видеть, отлично работает на Mac Safari и Chrome. Однако в IE 11/Win 8:

Изображение 174551

Строки таблицы таковы:

<tbody>
      <tr ng-repeat="item in type.header">
        <td class="{{item.extraclass}}">{{item.tag}} &ndash; {{item.font}}</td>
        <td>{{item.use}}</td>
        <td>
          {{item.tag}}{{item.class}}
          <span class="swatch" style="background-color:{{item.color}};color: #fff">{{item.color}}</span>,
          {{item.tag}}{{item.altclass}}
          <span class="swatch" style="background-color:{{item.altcolor}};color: #fff">{{item.altcolor}}</span>,
          {{item.tag}}.ko
          <span class="swatch" style="background-color:#fff; color:#2e2e2e">#FFFFFF</span>
        </td>
      </tr>
    </tbody>

Казалось бы, IE по какой-то причине не любит тег inline style.

Проверка кода в сафари выглядит так, как ожидалось. Вы можете увидеть тег стиля с фоновым цветом и цветом: Изображение 174551

Но, проверяя в IE11, все это испортилось. Там только один цвет, белый и rgb: Изображение 174551

Итак, почему это работает на Mac, но не в IE? Я предполагаю что-то о моем синтаксисе, но я пробовал несколько вещей и никаких результатов пока.

Теги:
ng-style

2 ответа

2
Лучший ответ

Вам нужно использовать ng-style:

<span ng-style="{'background-color':item.color, 'color': '#fff'}">
  • 0
    Удивительно. Я знал, что это было что-то в моем синтаксисе. В Angular есть много разных способов сделать вещи и форматы! Спасибо!
1

используйте ng-class вместо class

<td ng-class="item.extraclass">{{item.tag}} &ndash; {{item.font}}</td>
  • 0
    Я не использую классы. Я обрабатываю список шестнадцатеричных цветов css ...

Ещё вопросы

Сообщество Overcoder
Наверх
Меню