Angularjs How do you call a controller method inside a javascript function defined in the html template file?
Date : March 29 2020, 07:55 AM
will be helpful for those in need I figured it out with help from a friend. Here is the solution: in the signin.html file add an id to the div at the top. In the script code use that id to get to the scope using jquery (you don't need to use the angular.element()). <div id="loginwidget">
<div role="main" id="content" >
<div id="signIn" >
</div>
<div>
<div>
<script>
$.ready('loginwidget_main', function () {
loginwidget.load('signin', function () {
done : success,
fail : fail
});
});
function success() {
var scope = $('#loginwidget').scope();
scope.test();
}
function fail() {alert("failed to login");}
</script>
|
AngularJS call common controller function from outside controller
Date : March 29 2020, 07:55 AM
this will help You could run factory initialization in run method of your angular application. https://docs.angularjs.org/guide/module#module-loading-dependencies E.g. app.run(['userService', function(userService) {
userService.get_current_user();
}]);
...
if (data.success == true) {
root.user = data.user;
}
...
app.controller('myController', ['userService', function(userService) {
//alert(userService.user);
}]);
|
Using AngularJs ControllerAs approach, How can I call a function in a parent controller from the child controller?
Date : March 29 2020, 07:55 AM
I hope this helps . To answer your question as clearly as possible, you first must have a bit of background on how the Controller-As syntax actually works. Using Controller-As does not mean that you are not using $scope. In reality, $scope still exists. Controller-As is shorthand which creates an object on $scope and attaches the properties assigned via this to that object. On the view side, this object is explicitly bound to all the controls. you could still reference $scope.vm.property. However, since $scope is implicit in this scenario, it is not necessary to create a dependency to it.
|
How to call Angularjs controller function outside the controller in an Ajax call
Date : March 29 2020, 07:55 AM
this will help in order to run XMLHttpRequest requests to the server you have many options in angularjs, you dont have to mess with simple javascript and call angular scope to get variables and functions. you can do that either with $http or with services(leave it for now). i am going to show how you can make the request with $http in native angular. var app = angular.module('rdExampleApp', ['ui.rdplot']);
app.controller('rdPlotCtrl', function ($scope,$http) {...});
//show spinner
$('.spinner').show();
$http.post('dal/addEventHalls.php', {
data: {'data': $scope.datase}
})
.success(function (data) {
if (data == "null") {
//your code if return data empty
} else {
//your code if return data not empty
}
//hide spinner
$('.spinner').fadeOut();
})
.error(function (data, status, headers, config) {
console.log('error' + status);
//hide spinner in case of error
$('.spinner').fadeOut();
})
|
How to call second controller from first controller only after certain function in controller one executed in AngularJs
Date : March 29 2020, 07:55 AM
I wish did fix the issue. I am trying to communicate between two different controllers in AngularJs. The goal I want to achieve is to use the value of variable in first controller once is selected by drop down by user not the default value which i set. but unfortunately second controller used the default value of variable in second controller. var app = angular.module("myApp",[]);
//controllers declaration
app.controller('myCtrl1',function($scope, $rootScope){
$scope.selectedOption = "option-1";
$scope.change = function() {
$rootScope.$emit('changeName',{selectedOption:$scope.selectedOption});
}
});
app.controller('myCtrl2',function($scope, $rootScope){
$scope.selectedOption = "option-2";
$rootScope.$on('changeName', function(event,data) {
$scope.selectedOption = data.selectedOption;
})
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
<span class="div1" ng-controller="myCtrl1">
<select ng-model="selectedOption" ng-change="change()">
<option value="option-1">Option 1</option>
<option value="option-2">Option 2</option>
<option value="option-3">Option 3</option>
<option value="option-4">Option 4</option>
<option value="option-5">Option 5</option>
</select>
</span>
<span class="div2" ng-controller="myCtrl2">
<select ng-model="selectedOption">
<option value="option-1">Option 1</option>
<option value="option-2">Option 2</option>
<option value="option-3">Option 3</option>
<option value="option-4">Option 4</option>
<option value="option-5">Option 5</option>
</select>
</span>
</body>
|