Abhijeet Sinha Abhijeet Sinha - 2 months ago 13
AngularJS Question

I am using MVC 4 and angularjs in this actually I want to call an angular js function on page load

i want to invoke angularjs function (DeptSpecific) on page load and am passing ID as the parameter which is hard coded. And that i am passing via ng-init="DeptSpecific('1')". I am learning angularjs please suggest me how to call a function and pass a parameter to it on page load without any click or anything just when a page load a function should be called. If you are thinking why i used ng-init ..there is no specific reason for this it might be wrong but it calls the function well i can see that in debugger (f12) but $scope.s i undefined even though there is a matched ID.

$scope.DeptSpecific = function (ID) {

var BelongsToThisDepartment = [];
$http.get('/Department/getDept').success(function (response) {
$scope.departments = $scope.$eval(response);
});
angular.forEach($scope.departments, function (item1) {

if (item1.ID == ID) {
BelongsToThisDepartment.push(item1);
}
})

$scope.s = $scope.$eval(angular.toJson(BelongsToThisDepartment));

// console.log(JSON.stringify($scope.s));

}




<div ng-app="MyApp">
<div ng-controller="MyController">
<table class="tableData" border="0" cellspacing="0" cellpadding="0" ng-init="DeptSpecific('1')">
<thead>
<tr>
<th></th>
<th>ID</th>
<th>NAME</th>
<th>LOCATION</th>
</tr>
</thead>
<tbody ng-repeat="O in s">
<tr ng-class-even="'even'" ng-class-odd="'odd'">
<td class="CX" ng-click="student(O.ID)"><span>+</span></td>
<td>{{O.ID}}</td>
<td>{{O.Name}}</td>
<td>{{O.Location}}</td>
</tr>

Answer

Looking at your code, using ng-init is fine, but your $scope.departments may not be accessible outside of the .success method.

angular.module('MyApp')
 .controller('MyController', ['$scope', function($scope) {
    $scope.DeptSpecific = function (ID) {
      var BelongsToThisDepartment = [];
      $http.get('/Department/getDept')
        .success(function (response) {
           $scope.departments = $scope.$eval(response);

           angular.forEach($scope.departments, function (item1) {
             if (item1.ID == ID) {
              BelongsToThisDepartment.push(item1);
             }
           })
           $scope.s =   $scope.$eval(angular.toJson(BelongsToThisDepartment));
           console.log($scope.s);
       });
     }
 }]);

now if that works for you but you also want to be able to access $scope.s outside of that .success;

You can write a function, add it into .success pass the value returned onSucess, and do what you want to do.

.success(function(response) {
  callAFunction(response);
 }     
Comments