Как добавить подсказку в ui multi select

Question

Я попытался добавить всплывающую подсказку в поле ввода в ui-select, но не работает.

ввода (тип = 'скрытый', щ-Select2 = 'userSelect2options', данных заполнители = 'Все Пользователь', нг-модели = 'selectedUsersForFilter', стиль = "ширина: 100%; Запасли налево: 5px;», нг-только для чтения =„isUserSelectDisabled“, подсказка =„Пожалуйста выбрать по крайней мере один пользователь“)

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

ввода (тип = 'скрытый', щ-Select2 = 'userSelect2options', данных заполнители = 'Все Пользователь', нг-модели = 'selectedUsersForFilter', стиль = "ширина: 100%; левое поле: 5px;», нг-только для чтения = 'isUserSelectDisabled', название = 'Пожалуйста выбрать по крайней мере один пользователь')

Как добавить всплывающую подсказку для ввода в Ui-выбор2?

Answer 1

Я столкнулся с той же проблемой, как вы и решил, что создание пользовательского uiSelect директивы, которая расширяет оригинальную директиву, так же, как это:

angular.module('myModule') 
    .directive('uiSelect', function ($compile) { 
    return { 
     link: function postLink(scope, element, attrs) { 
     var input = angular.element(element.find('input')[0]); 

     if (attrs.ttpMsg) { 
      input.attr('tooltip', attrs.ttpMsg); 
      $compile(element.contents())(scope); 
     } 
     } 
    }; 
    }); 

И в представлении:

<ui-select ng-model="myModel" ttp-msg="{{myMessage}}"> 
    <!-- custom stuff --> 
</ui-select> 

Примечания что я использую настраиваемый атрибут (ttp-msg), поэтому мне не нужно удалять исходный атрибут «tooltip» из этого элемента, что может привести к дублированию директивы подсказки (один для родителя и другой для ввода или дочернего элемента).

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

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

Я думаю, что это может быть достигнуто и с декоратором, но мне придется подождать, чтобы еще немного времени экспериментировать с ним.

Надеюсь, это поможет.

Answer 2

вы можете добавить заголовок в кэше шаблона, возьмите самозагрузки тему, например

$templateCache.put("bootstrap/match-multiple.tpl.html","<span class=\"ui-select-match\"><span ng-repeat=\"$item in $select.selected\"><span title='{{$item.caption}}' class=\"ui-select-match-item btn btn-default btn-xs\" tabindex=\"-1\" type=\"button\" ng-disabled=\"$select.disabled\" ng-click=\"$selectMultiple.activeMatchIndex = $index;\" ng-class=\"{\'btn-primary\':$selectMultiple.activeMatchIndex === $index, \'select-locked\':$select.isLocked(this, $index)}\" ui-select-sort=\"$select.selected\"><span class=\"close ui-select-match-close\" ng-hide=\"$select.disabled\" ng-click=\"$selectMultiple.removeChoice($index)\">&nbsp;&times;</span> <span uis-transclude-append=\"\"></span></span></span></span>");