javascript - Passing parameter from view to controller to factory in AngularJS -


i'm new angularjs using bootstrap. have following html:

<div ng-controller="brandcompanycontroller">     <tabset>         <tab ng-repeat="brand in brands" heading="{{brand.name}}" active="brand.active" disable="brand.disabled">             <div ng-controller="modelcontroller" ng-init="init(brand.id)">                  <accordion>                     <accordion-group heading="{{model.model_name}}" ng-repeat="model in models">                         insert data here                     </accordion-group>                 </accordion>               </div>          </tab>      </tabset> </div> 

the brand tabs created, however, list of models not created. i'm trying pass brand id model controller using ng-init.

my modelcontroller looks like:

myapp.controller('modelcontroller', ['$scope', 'modelfactory',     function ($scope, modelfactory) {           $scope.init = function(id)         {             $scope.brandid = id;             console.log("inside init: " + $scope.brandid);          }          console.log("outside init: " + $scope.brandid);           getmodels($scope.brandid);          function getmodels(brandid) {              modelfactory.getmodels(brandid)                 .success(function (mdls) {                     $scope.models = mdls;                     console.log($scope.mdls);                 })                 .error(function (error) {                     $scope.status = 'unable load model data: ' + error.message;                     console.log($scope.status);                 });         }     }]); 

and factory:

myapp.factory('modelfactory', ['$http', function ($http) {      var modelfactory = {};     modelfactory.getmodels = function (id) {              return $http({             method: 'get',             url: '/models/getmodels',             params: { brandid: id }         });     };      return modelfactory;  }]); 

the $scope.init in modelcontroller sets $scope.brandid. after that, before call getmodels, $scope.brandid value undefined. doing wrong here?

your $scope.init being called after controller loaded. move getmodels($scope.brandid) call inside function:

$scope.init = function(id) {     $scope.brandid = id;     console.log("inside init: " + $scope.brandid);     getmodels(id); } 

this happens because first, js loaded , run. $scope.init gets defined, console.log("outside init: " + $scope.brandid); called, , getmodels function called.
then, html finishes loading. around time, ng-init="init(brand.id)" executed.


Comments