angular-ui bootstrap 选项卡 select 单击时的功能

Question

我正在尝试使用 angular ui bootstrap 在选项卡 select 上调用表达式函数，但是表达式未被调用，而是在检查 angular检查器函数/表达式存在：下面是我的代码工作：

注意：其他选项卡功能正常

Angular 查看

<uib-tab ng-click="vm.alertMe" select="" heading="New Invoice">
                          .....
 </uib-tab>

控制器用作虚拟机

vm.alertMe = alertMe;

 function alertMe() {
            setTimeout(function() {
              $window.alert('You\'ve selected the alert tab!');
            });
          }

Answer 1

为什么不直接在vm上定义alertMe函数。我看不到你的整个代码。我认为如果您的 vm 在控制器中正确分配为 this，它应该可以工作。还要确保在 html 中正确定义了您的控制器。让我知道:)

vm.alertMe = function() {
              setTimeout(function() {
               $window.alert('You\'ve selected the alert tab!');
              });
             }

Answer 2

您没有在 DOM 中调用函数。

而不是这个：

<uib-tab ng-click="vm.alertMe" select="" heading="New Invoice">

你应该这样称呼它：

<uib-tab ng-click="vm.alertMe()" select="" heading="New Invoice">

Answer 3

始终注入您在 angular 应用程序中使用的基本服务名称，在上面的示例中我没有调用：导致错误/错误的 $window 服务。我的最终控制器是以下 :

function() {

    'use strict';

    angular
        .module('app.patients')
        .controller('PatientsController', PatientsController);

    PatientsController.$inject = ['$http','$window'];
    /* @nginject */
    function PatientsController($http, $window) { 
       vm.alertMe = function() {

             $window.alert('You\'ve selected the alert tab!');
           }
     }
}

和视图，

<uib-tab  select="vm.alertMe()" heading="New Invoice">
                          .....
 </uib-tab>

angular-ui bootstrap 选项卡 select 单击时的功能

angular-ui bootstrap tab select function on click

angularjs

angular-ui-bootstrap