2016-09-12 7 views
0

Привет Я пытаюсь использовать uib-popover-template на шрифте удивительный значок как своеобразное меню настроек, но не может получить всплывающее окно для показа. Это в заголовке страницы я использую:uib-popover-template не отображается

<h3>{{vm.title}} 
     <i class="fa fa-ellipsis-v pull-right" 
      aria-hidden="true" 
      uib-popover-template="'options-panel.html'" 
      popover-placement="left"></i> 
    </h3> 

И у меня есть эллипсы в правом углу вроде как меню «Дополнительные параметры». options-panel.html всего 4-5 <select> выпадающие в зависимости от страницы, которая выглядит следующим образом:

<div class="row"> 
    <div class="form-group col-md-12"> 
    <label for="viwemode">View&nbsp;Mode</label> 
    <select id="viewmode" 
     class="form-control" 
     ng-model="vm.currentViewer" 
     ng-options="view for view in vm.views" 
     ng-change="vm.viewChange();"></select> 
    </div> 
    <div class="form-group col-md-12" 
     ng-repeat="viewOption in vm.genericOptions"> 
    <label for="{{viewOption.label}}">{{viewOption.label}}</label> 
    <select id="{{viewOption.label}}" 
     class="form-control" 
     ng-model="vm.config[viewOption.label]" 
     ng-options="v as k for (k,v) in viewOption.values" 
     ng-change="vm.optionChange(viewOption.label);"></select> 
    </div> 
    <div class="form-group col-md-12" 
     ng-repeat="viewOption in vm.viewerOptions"> 
    <label for="{{viewOption.label}}">{{viewOption.label}}</label> 
    <select id="{{viewOption.label}}" 
     class="form-control" 
     ng-model="vm.config[viewOption.label]" 
     ng-options="value for value in viewOption.values" 
     ng-change="vm.optionChange(viewOption.label);"></select> 
    </div> 
</div> 

И, наконец, в контроллере для класса я просто этот объект, который имеет шаблон URL в нем:

vm.popover = { 
    template: '<a href uib-popover-template="\'options-panel.html\'" popover-placement="left"></a>' 
}; 

Я не уверен, что я пропущу, но даже popover не покажет, не говоря уже о одном с моим шаблоном в нем. Если я просто сделаю эллипсы (fa-icon) с uib-popover="test", popover отобразит с ним «test», чтобы я правильно установил зависимость uib.

ответ

-1

Эта линия

uib-popover-template="'options-panel.html'" 

Должно быть

uib-popover-template="options-panel.html" 

Примечание я удалил одинарные кавычки, uib-popover-template принимает выражение, которое будет оценивать на месте шаблона на вашем $scope. пропуская путь шаблона в одинарных кавычках, вы передаете только обычную строку в качестве выражения.

От Docs

UIB-поповер-шаблон - URL-адрес, представляющий местоположение шаблона, чтобы использовать для тела поповер

+0

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

0

Рассмотрим этот uib-popover-template plunker

Я не» т знать структуру данных, но должен работать.

Вам не нужно больше

vm.popover = { 
    template: '<a href uib-popover-template="\'options-panel.html\'" popover-placement="left"></a>' 
}; 
+0

Можете добавить подробный код и описание –

Смежные вопросы