Philip Isaacs Philip Isaacs - 1 year ago 150
AngularJS Question

using ng-click to update every cell in a table column

I'm new to Angular and I was trying to figure out how to have the data in one of the columns in a table I made convert from one number format to another when the user clicks on the top of the table cell. I've create a filter already, but i don't know how to call it so it effects all the cells in the table.

<tr ng-repeat="x in data">
<td>{{}} </td>
<td>{{x.number}}</td> <--- THIS IS WHAT I WANT TO CONVERT

I'm not even sure where to start with this. I basically have a ng-click directive call "convert" which I've defined in the controller. I know that if I define a variable in the $scope (such as $ = "1") and then call the convert() function I can replace the value like this:

$scope.convert = function(){
$ = 2;

And then my table updates with that value. But what if every table cell in that column has a different value, and I basically want to run that value through a filter I've made.

Any suggestions on how to approach this?


You said you already have a filter? Then just give your filter an argument 'numberFormat':

angular. module('yourModule'). filter('yourFilter', function() { return function(input, numberFormat) { // convert the input according to the numberFormat return filteredValue; }; });

Then you can update the format in your convert() scope-method:

$scope.convert = function(){ $scope.numberFormat = 'long'; }

and pass it to your filter:

<td>{{x.number | yourFilter:numberFormat}}</td>

BTW: Read about controllerAs - IMHO it is a better practice to store values at the controller rrather than directly on the scope.