為什么我變得未定義不是函數？

Question

我正在嘗試使用有角度的UI pop over來制作popover。我加載了html並使其符合HTml，但是當我運行程序並單擊ICon（我正在顯示pop over的星形圖標）時，我得到了undefined錯誤不是一個函數嗎？

http://plnkr.co/edit/o0mVZujOH0Apqurvq9xX?p=preview

我用這些線

     <td ><span   pop-over items="items", title="Mode of transport" class="glyphicon glyphicon-star content"></span> </td>

app.directive('popOver', function ($compile) {
  var itemsTemplate ="<div ng-controller='AfterCtrl'><ul class='list-group'><li class='list-group-item' ng-click='editRowName()'>Edit</li><li class='list-group-item ' ng-click='deleteRow($index)'>Delete</li></ul></div>" ;
  var getTemplate = function (contentType) {
    var template = '';
    switch (contentType) {
      case 'items':
        template = itemsTemplate;
        break;
    }
    return template;
  }
  return {
    restrict: "A",
    transclude: true,
    template: "<span ng-transclude></span>",
    link: function (scope, element, attrs) {
      var popOverContent;
      if (scope.items) {
        var html = getTemplate("items");
        popOverContent = $compile(html)(scope);
      }
      var options = {
        content: popOverContent,
        placement: "bottom",
        html: true,
        title: "aa"
      };
      $(element).popover(options);
    },
    scope: {
      items: '=',
      title: '@'
    }
  };
});

Answer 1

第一個問題是由於您再次在底部導入jQuery（正如其他人已經提到的那樣）。 因此，刪除最后的jQuery導入。

主要問題是scope.items是未定義的，因此您永遠不會進入if ，因此popOverContent仍然是未定義的。 您可能打算使用：

...
$scope: {
    items: '@',
    ...
}

---

另請參見此修改后的plunkr 。

---

_{與問題沒有直接關系，但是這里是popOver指令的修改后的實現 。 我已經對其進行了一些更改（以使其盡可能少地更改），例如，它不再具有隔離作用域，不使用固定模板等。
這些按鈕可以正常工作。}