AngularJS insert data in nested array and sorting with a specific nested array object

Question

I'm a newbie in AngularJS and I want to have a JSON-like nested array in my $scope.tabledata. But everytime I click the add button, nothing happens :( Your ideas will be highly appreciated.

Here's my plunker:

http://plnkr.co/edit/GdoaYI

//Array I want to Achieve

var SampleDataToProduce =  {
                     "Continent":"Asia",
                     "ContinentId":"ContId1",
                     "Countries": {
                                  "Japan":
                                      [
                                      {
                                      "Id": 3,
                                        "ColumnIndex": 3,
                                        "ColumnName":"Tokyo",
                                        "Interests":{
                                                      "Music":["JRock","JPop"]
                                                    }
                                      },
                              {
                              "Id": 4,
                                        "ColumnIndex":2,
                                        "DisplayText":"Comment",
                                        "ColumnName": "Osaka",
                                        "Interests":"Music","Anime":{} 
                              }
                                        ]
                                  }
                            }  

Answer 1

You have quite a few syntax errors in your scripts. I would suggest you check your syntax thoroughly.

In your addThisColumn function, your tabledata should be $scope.tabledata instead. This is the working function:

        $scope.addThisColumn = function () {
        $scope.tabledata.push({
            Continent : $scope.continent,
            ContinentId : $scope.continentid,
            Country: $scope.country
          })
       };

Here is the working plunkr, I am sort of guessing this maybe what you want/need.

At the same time, you may want to read up on the official documentation of AngularJs.

Answer 2

you made some basic mistakes in your code. you didn't used your $scope variables correctly (e.g.: you tried to push into 'tabledata', not '$scope.tabledata').

in your last line tabledata.Countries.Country.push({ColumnIndex: $scope.columnindex}) (where you also should use $scope.tabledata) you are trying to push into Countries.Country, but there is no such field in Countries. something like $scope.tabledata.Countries[$scope.country] would be possible i guess.

hope that helps, welcome on stackoverflow