AngularJS中点击按钮触发Tooltip提示框无响应问题求助

各位大佬好，我现在在AngularJS里做一个点击按钮弹出Tooltip提示框的功能，结果点击按钮后完全没反应，控制台也没报任何错误，实在找不到问题所在，有没有人能帮忙看看该怎么解决这个问题？

我的代码如下： #

index.html

<!DOCTYPE html>
<html ng-app="appModule">
  <head>
    <!-- 引入所需的CSS和JS依赖 -->
    <link
      rel="stylesheet"
      href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
    />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-csp.css"
    />
  </head>
  <body>
    <!-- 带点击触发Tooltip的按钮 -->
    <div ng-controller="TooltipController">
      <button
        type="button"
        class="btn btn-primary"
        tooltip-template="'clickTooltip.html'"
        tooltip-trigger="'none'"
        tooltip-is-open="tooltipOpen"
        tooltip-placement="bottom"
        tooltip-append-to-body="true"
        tooltip-enable="true"
        ng-click="toggleTooltip($event)"
      >
        Click me for info
      </button>
    </div>

    <script type="text/ng-template" id="clickTooltip.html">
      <div class="click-tooltip">
        <h4>{{ title }}</h4>
        <p>{{ content }}</p>
        <button class="btn btn-xs btn-default" ng-click="closeTooltip()">Close</button>
      </div>
    </script>

    <!-- 引入所需的JavaScript库 -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.min.js"></script>
    <!-- 自定义编译后的JS文件 -->
    <script src="bundle.js"></script>
  </body>
</html>

index.js

import angular from 'angular';

// 先创建模块
const app = angular.module('appModule', ['ui.bootstrap']);

// 在模块上定义控制器
app.controller('TooltipController', [
  '$scope',
  '$document',
  '$timeout',
  function ($scope, $document, $timeout) {
    $scope.tooltipOpen = false;
    $scope.title = 'Important Information';
    $scope.content =
      'This tooltip appears on click and stays open until closed.';

    $scope.toggleTooltip = function ($event) {
      $event.stopPropagation();
      $event.preventDefault();
      $scope.tooltipOpen = !$scope.tooltipOpen;
    };

    $scope.closeTooltip = function () {
      $scope.tooltipOpen = false;
      // 应用数据变更
      $scope.$apply();
    }; 
  },
]);

备注：内容来源于stack exchange，提问作者Power All