javascript - Returning array into $scope doesn't work -


i've got array arr in function i'd return $scope.notifications can use in html within ionic framework. need via function can perform several actions array before returning later on. controller:

.controller('notificationsctrl', function($scope) {     $scope.notifications = function(){         var arr = [             {user:"misterx", name:"mister x", action:4, image: "https://www.holidaycheck.de/mediaproxy?target=hcahr0cdovl3d3dy5ob3rlbc5kzs9tzwrpys9ob3rlbc9wawn0dxjlcy8zmzqvmzm0mtizl0v4dgvyaw9yxzyzntkynzk5ndmyodq1otawmi5qcgc%3d"},             {user:"misterx", name:"mister x", action:2, image: "https://www.holidaycheck.de/mediaproxy?target=hcahr0cdovl3d3dy5ob3rlbc5kzs9tzwrpys9ob3rlbc9wawn0dxjlcy8zmzqvmzm0mtizl0v4dgvyaw9yxzyzntkynzk5ndmyodq1otawmi5qcgc%3d"},             {user:"ladyx", name:"lady x", action:1}         ];         return arr;     } }) 

the html:

<ion-item ng-repeat="msg in notifications" class="item-text-wrap">     <div class="row">         <div class="col-80">             <strong>{{msg.name}}</strong> (<em>@{{msg.user}}</em>) {{msg.action}}.         </div>         <div class="col-20">             <img src="{{msg.image}}" style="border-radius: 50px; width: 100%">         </div>     </div> </ion-item> 

when pass notifications directly array, without function, works. doing wrong here?

using ng-repeat="msg in notifications" tries repeat on function itself, not return value. want call function instead:

<ion-item ng-repeat="msg in notifications()">

https://jsfiddle.net/dj1gpjb8/

i should point out, though, there performance issues approach: function called because angular can't predict whether result of function change. you're better off embedding notifications plain array on scope; modifies array later automatically trigger component re-render new value(s):

  $scope.notifications = [{     user: "misterx",     name: "mister x",     //...   }];    $scope.addnotification = function() {     $scope.notifications.unshift({       user: "newguy",       name: "new guy"     });     // angular notice notifications[] has changed, , re-render component on next $digest   }; 

https://jsfiddle.net/1du593af/


Comments