Sharing scope between nested directives and controllers in Angularjs -


i have created controller , directive in angular application defined following:

app.controller('crudctrl', ['$scope', '$http', function($scope, $http) {      $scope.isloading = true;      $scope.pagechanged = function(){         $http({             method: 'get',             url: 'http://localhost:8080/rest/repository'+$scope.repository.path,             params: {                 size: 3,                 page: $scope.currentpage             }         }).             success(function (data, status){                 $scope.rowcollection = data._embedded['rest-original-product'];                 $scope.totalpages = data.page.totalpages;                 $scope.currentpage = data.page.number + 1;                 $scope.totalelements = data.page.totalelements;                 $scope.pagesize = data.page.size;                 $scope.isloading = false;                 $scope.numpages = 5;             }).             error(function (data, status){                 log.error("error");             });     };       $scope.$watch('repository', function(newval, oldval){         if(newval!=null && oldval!=newval ){          }     });   }]); app.directive('crud', ['$resource', 'crudconstant', '$http', function($resource, crudconstant, $http) {     return {         //scope:{},         link: function(scope, element, attrs) {             scope.repository = crudconstant[attrs.repository];              $http({                 method: 'get',                 url: 'http://localhost:8080/rest/repository'+scope.repository.path,                 params: {                     size: 3                 }             }).                 success(function (data, status){                     scope.rowcollection = data._embedded['rest-original-product'];                     scope.totalpages = data.page.totalpages;                     scope.currentpage = data.page.number + 1;                     scope.totalelements = data.page.totalelements;                     scope.pagesize = data.page.size;                     scope.isloading = false;                     scope.numpages = 5;                 }).                 error(function (data, status){                     log.error("error");                 });           },         templateurl: 'tpl/app/crud/crud.html'     }; }]); app.directive('table', ['$resource', function($resource) {     return {          link: function(scope, element, attrs) {          },         templateurl: 'tpl/app/crud/table.html'     }; }]); 

while structure following:

<div ui-view class="fade-in-up" ng-controller="crudctrl">     <crud repository="originalproduct">      </crud> </div> 

where here goes crud template:

<div class="col-sm-5 m-b-xs">     <pagination             total-items="totalelements"             items-per-page="pagesize"             ng-change="pagechanged()"             ng-model="currentpage"             max-size="5"             class="pagination-sm m-t-none m-b"             boundary-links="true"             rotate="false"             num-pages="numpages"></pagination> </div> <div>{{rowcollection}}</div> 

when launch application rest call executed correctly , data shown expected (rowcollection shows correct data), when click on pagination button calls pagechanged() function, controller has not $scope.repository property set. seems happening controller not binded/linked scope defined in directive.

i tried add scope.$apply() @ end od link function in directive error in case: "error: [$rootscope:inprog] $digest in progress".

i have not read there mistake in first line app.controller('crudctrl', ['$scope', 'schemaform', '$http', function($scope, $http) should app.controller('crudctrl', ['$scope', 'schemaform', '$http', function($scope, schemaform, $http)


Comments

Popular posts from this blog

javascript - AngularJS custom datepicker directive -

javascript - jQuery date picker - Disable dates after the selection from the first date picker -