CODEWITHSUNDEEP
angularjsternary-operatorangularjs-filter
Veg
Veg

Reputation: 636

How do i conditionally change the parameter of an angular filter

I have a custom angular filter, ellipsesFilter, that I use for truncating and adding an ellipses to words that are too long to fit in a particular table.

Like this: 

<div>{{app.firstLastName | ellipsesFilter:13 }}</div>

However, if app.flag is true we add another word to the end of firstLastName. If that's the case, then I want the ellipses filter param to be different. Ideally, something like this

{{app.firstLastName | app.flag? : ellipsesFilter:10 : ellipsesFilter:13}}

I've tried various ways of doing this, none have worked. Anyone know how?

Upvotes: 1

Views: 1469

Answers (2)

j.wittwer
j.wittwer

Reputation: 9497

You were close.. you actually can use the ternary operator to switch the parameter value like this:

{{name | ellipsesFilter:flag ? 10 : 13}}

Here is a demo: http://plnkr.co/zWsNk1VzVgBZeoGb5NCP

Upvotes: 2

Nix
Nix

Reputation: 58522

You can use a value on scope ? 

<div>{{app.firstLastName | ellipsesFilter:lengthToFilter }}</div>
//js
$scope.lengthToFilter =  $scope.app.flag? 13:10

Its also smart enough to accept a function:

<div>{{app.firstLastName | ellipsesFilter:getLengthToFilter() }}</div>   
//js
$scope.getLengthToFilter = function(){
      return $scope.app.flag? 13:10 ;
}

Upvotes: 1

Related Questions