Question

您好我试图在字体真棒图标上使用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>'
};

我不确定我错过了什么，但即使是弹出框也不会显示我的模板中的那个。如果我只用uib-popover="test"做省略号（fa-icon），那么popover会显示'test'，所以我确实正确安装了uib依赖。

Answer 1

考虑这个uib-popover-template plunker

我不知道您的数据结构，但应该可以使用。

你不再需要了

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

Answer 2

这一行

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

应该是

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

注意我删除了单引号，uib-popover-template接受了一个表达式，该表达式将评估$scope上的模板位置。通过在单引号中传递模板路径，您只传递一个普通字符串作为表达式。

来自Docs

uib-popover-template - 表示用于弹出框体的模板位置的URL

uib-popover-template没有显示

2 个答案: