HMdeveloper
HMdeveloper

Reputation: 2884

how to update the table each time that button clicked

I have a list of items and I want to show them in a table and I have a button and whenever a user click on that the array would be updated and the table should update after that.

Here is a codes link of my code :

link to code

here is my code as well:

 var app=angular.module('app',[]);
 app.controller('table',function($scope){
 alert("ddd");
 $scope.typesHash=[{name : 'sugar', price : 1,unit:1 },
                {name : 'lemon', price : 100,unit:2.5 }];
   $scope.addTable=function(){
    var arr={name : 'meat', price : 200,unit:3.3  };
      $scope.typesHash.add(arr);
  }
});

When the code loads for the first time table gets updated but when I click on the button nothing happens!!! Can anyone help how I can do that?

Upvotes: 0

Views: 989

Answers (1)

Peter Ashwell
Peter Ashwell

Reputation: 4302

You need to actually call the function clickTable, your expression was incorrect. AND you need to remove the extra controller:

   <div id="clcikbtn" style="background-color:black;width:20px;height:20px;" ng-click="addTable" ng-controller="table"></div>

Should be:

   <div id="clcikbtn" style="background-color:black;width:20px;height:20px;" ng-click="addTable()"></div>

Finally, change 'add' to 'push' in addTable function:

      $scope.typesHash.push(arr);

Updated plunkr:

http://plnkr.co/edit/un81F5wpnvHr6zNtlFzL?p=preview

Upvotes: 1

Related Questions