Call a function from function inside the same controller
Solution 1
You need to call this.getSomething1()
but there's a catch.
The problem here is that this
inside the function is not always the same as this
outside it. So to be safe, save the controller this
in a variable and use that to call the function:
angular.module('App')
.controller('Controller', ['$http', '$scope', function ($http, $scope) {
var vm = this;
vm.getSomething1 = function () {
};
vm.getSomething2 = function () {
if(1 == 1){
vm.getSomething1();
}
};
}
]);
Another option that can make for much cleaner code is to always use named functions. You can still expose whichever of them need to be exposed on the controller but you can also call them directly.
angular.module('App')
.controller('Controller', ['$http', '$scope', function ($http, $scope) {
angular.extend(this, { getSomething1: getSomething1, getSomething2: getSomething2 });
return;
function getSomething1() {
};
function getSomething2() {
if(1 == 1){
getSomething1();
}
};
}
]);
This also has the benefit of separating the initialisation code at the top of the controller instead of scattering it through the function declarations.
The extend
call looks even cleaner if you can use ES2016 syntax:
angular.extend(this, { getSomething1, getSomething2 });
Solution 2
Try using the scope variable instead of this in the controllers,
angular.module('App')
.controller('Controller', ['$http', '$scope', function ($http, $scope) {
var scope = $scope
scope.getSomething1 = function () {
};
scope.getSomething2 = function () {
if(1 == 1){
scope.getSomething1();
}
};
}
]);
You can also declare a controller using a functional syntax as,
(function() {
'use strict';
angular
.module('App')
.controller('Controller', Controller);
/** @ngInject */
function Controller($http, $scope) {
var scope = $scope
scope.getSomething1 = function () {
};
scope.getSomething2 = function () {
if(1 == 1){
scope.getSomething1();
}
};
}
})();
Comments
-
ottercoder over 1 year
So I'm trying to call a
function
fromanother function
. And both of them defined inside the sameController
. But with everything I've tried so far it's"funtion is not defined"
at the best. How to do this thing properly?angular.module('App') .controller('Controller', ['$http', '$scope', function($http, $scope) { this.getSomething1 = function() {}; this.getSomething2 = function() { if (1 == 1) { getSomething1(); } }; }]);
ReferenceError: getSomething1 is not defined
-
Duncan over 7 yearsMuch better though to use
this
and the "controller as" form of the syntax. -
Rohit416 over 7 yearsThis would work but the named function approach sounds much better not only because it just works, it is cleaner as well. Adding the methods on scope will expose them to views (at least for the private one's).