IE, ng-repeat для выбора разрезаемого текста или отображения {{}}

javascript angularjs internet-explorer-11

515 просмотра

1 ответ

12974 Репутация автора

Основная проблема

У меня есть множественный выбор (список), что в зависимости от того, как я пишу HTML / Angular есть ошибка. В первом случае последние 3 символа отсекаются от рендеринга. Во втором случае имя не отображается, но вместо этого используется {{}}заполнитель до тех пор, пока элемент не будет нажат.

Я просто хотел бы, чтобы я правильно отображал элементы без ошибок.

Наконец, такое поведение, кажется, происходит, если элемент добавляется в categoriesмассив после страницы и выполняется выборка select.

С нг-бинд

<select id="categories" name="categories" class="ep_field sumoSelect" multiple="multiple"
        ng-model="selectedCategories"
        ng-change="angularCategorySelectedGrants($event)"
   <option ng-repeat="cat in categories" value="{{cat.id}}" ng-bind="cat.name"></option>
</select>

введите описание изображения здесь

Без нг-бинд

<select id="categories" name="categories" class="ep_field sumoSelect" multiple="multiple"
        ng-model="selectedCategories"
        ng-change="angularCategorySelectedGrants($event)"
   <option ng-repeat="cat in categories" value="{{cat.id}}">{{cat.name}}</option>
</select>

введите описание изображения здесь

С нг-опциями

С ng-options все появляется, но я не могу фактически нажать на элементы, чтобы выбрать их - они заморожены.

<select id="categories" name="categories" class="ep_field sumoSelect" multiple="multiple"
    ng-model="selectedCategories"
    ng-change="angularCategorySelectedGrants($event)"
    ng-options="cat.name for cat in categories track by cat.id" >
</select>

Поскольку никто не написал ответ, воспринимайте мой обходной путь как принятый ответ.

Автор: Menelaos Bakopoulos Источник Размещён: 19.07.2016 08:49

Ответы (1)


1 плюс

12974 Репутация автора

Решение

Мой собственный обходной путь

Кажется, проблема была в добавлении элемента в categoriesмассив после первоначального рендеринга. Там мы нашли два обходных пути:

  1. Добавить все элементы в массив только один раз без добавления ИЛИ
  2. Скройте dom selectэлемент ng-ifна 100 мс и снова сделайте его видимым. Это заставляет браузер перерисовывать элементы и отображает их правильно.

В HTML (обтекание выделенным):

<div ng-if="categories!=undefined && categoriesLoaded">
    ...Select code here...
</div>

В контроллере (Javascript):

$scope.categoriesLoaded = false;
//Trigger render
$timeout(function(){  $scope.categoriesLoaded = true;}, 0);
Автор: Menelaos Bakopoulos Размещён: 11.10.2016 01:17
Вопросы из категории :
32x32