In angular js how to create Multi dimensional array with dynamic name

Question

I'm new to Angular JS. Here i have some doubt. I have this code:

.controller("boardController", function($scope, $http) {

   $scope.models = {
        selected: null,
        lists: {"A": [], "B": []} 
    };

    $http({ 
        method  : "get",
        url     : "/boards"
    })
    .then(function(response){
      $scope.ajax_val = response.data;
      angular.forEach($scope.ajax_val, function(value, key){
      var bname = value.board_name;
       $scope.models.lists.push(bname);
    });
  });

In this code push function returns error.. I dont know why?

Thanks Advanced!!...

$scope.models.lists is not an array. You can't use push method on it. You can use $scope.models.lists.A.push() or $scope.models.lists.B.push() — Natiq
– Natiq, Commented Nov 1, 2016 at 11:25
here i want to add dynamic names from database in lists array. and each names have one array. — SARAN
– SARAN, Commented Nov 1, 2016 at 11:26
Thanks Natiq... But i want to add A, B as dynamically. and add C, D, E etc. — SARAN
– SARAN, Commented Nov 1, 2016 at 11:28
What is response.data format? Can you give example data? — Natiq
– Natiq, Commented Nov 1, 2016 at 11:28
This is the response from laravel. [{"board_name":"boardone","id":1},{"board_name":"boardtwo","id":2}] Here i want to add these board one, board two as A, B, C.... — SARAN
– SARAN, Commented Nov 1, 2016 at 11:31

Fernando Farias · Accepted Answer · 2016-11-01 13:46:26Z

1

This is a JavaScript question, not about AngularJs itself.

But, you are getting this error because "lists" is an object and not an array, so it does not have the push function.

See more at: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Object

I suggest you to change your approach to something like:

.controller("boardController", function($scope, $http) {

$scope.models = {
    selected: null,
    lists: [] 
};

$http({ 
    method  : "get",
    url     : "/boards"
})
.then(function(response){
  $scope.ajax_val = response.data;
  angular.forEach($scope.ajax_val, function(value, key){
    var bname = value.board_name;
    var model = {};
    model[bname] = [];
     $scope.models.lists.push(model);
  });
});

edited Nov 1, 2016 at 13:46

answered Nov 1, 2016 at 11:29

Fernando Farias

1961 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

SARAN Over a year ago

Thanks.. K.. Then how to create a object dynamically using my response

Fernando Farias Over a year ago

I'm not getting what you want exactly, but I believe if you transform your "lists" in a properly array like: lists: [] and then push an object to it like: var myObj = {}; myObj[bname] = []; $scope.models.lists.push(myObj);

Fernando Farias Over a year ago

You're welcome SARAN, I'll update my answer to help others with the same doubt, could you please mark as answered if it has helped you?

Collectives™ on Stack Overflow

In angular js how to create Multi dimensional array with dynamic name

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related