CODEWITHSUNDEEP
angularjsangular-ui-bootstrap
Jimmy Obonyo Abor
Jimmy Obonyo Abor

Reputation: 7875

angular-ui bootstrap tab select function on click

Am trying to call an expression function on tab select using angular ui bootstrap, however the expression is not being called but checking on angular inspector the function /expression exists : below is my code work:

NB : Other tabs function correctly

Angular View

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

controller used as vm

vm.alertMe = alertMe;

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

Upvotes: 1

Views: 16731

Answers (3)

Jimmy Obonyo Abor
Jimmy Obonyo Abor

Reputation: 7875

Always inject the base service names you use in your angular app ,in the above example i was not calling : $window service which resulted in the bug / error .my final controller is as following : 

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!');
           }
     }
}

and the view ,

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

Upvotes: 0

jusopi
jusopi

Reputation: 6813

You're not calling the function in your DOM.

instead of this:

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

you should be calling it like this:

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

Upvotes: 5

LeOn - Han Li
LeOn - Han Li

Reputation: 10174

Why not define the alertMe function directly on the vm. I can not see your whole code. I assume it should work if you vm is correctly assigned as this in the controller. Also make sure in the html, your controller is correctly defined. Let me know :)

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

Upvotes: 0

Related Questions