AngularJS - Can't use filter to set variable in view

Question

I'm using a filter to calculate values, but then I want to access them later on.

Here's a snippet of my code:

app.controller('CreateProposalCtrl', function() {
     $scope.EstimatedCostItem = [];
});

-

app.filter('EstimatedValue', function() {
        return function(input, arguments) {
             ...blah blah calculations
             return calculations;
        };
    });

I'm not sure how the HTML should be presented.

This displays exactly what I want..BUT I need it to set a variable so I can access it somewhere else..

<span ng-repeat="foo in bar">
    {{ Type.JobTypeID | EstimatedValue: form }}
</span>

I've tried:

<span ng-model="EstimatedCostItem[Type.JobTypeID]" ng-bind="Type.JobTypeID | EstimatedValue: form"></span>

And:

<span ng-bind="EstimatedCostItem[Type.JobTypeID]">{{ Type.JobTypeID | EstimatedValue: form }}</span>

And:

<span ng-init="EstimatedCostItem[Type.JobTypeID] = (Type.JobTypeID | EstimatedValue: form)"></span>

Nothing seems to set a variable. I'm stumped :(

When do you need to set a variable ?

Rus Paul
– Rus Paul

2015-06-15 14:32:42 +00:00
Commented Jun 15, 2015 at 14:32 — Rus Paul
– Rus Paul, Commented Jun 15, 2015 at 14:32

Agop · Accepted Answer · 2015-06-15 14:37:13Z

1

The filter syntax only works within specific Angular expressions. Expressions that use plain JavaScript cannot use the foo | bar filter syntax, as it's not valid JavaScript.

What you could do is use $filter:

var value = $filter('EstimatedValue')(foo);

Remember to inject $filter into your controller.

With that said, this probably isn't the best use of a filter. Why not create a scope function that calculates and stores the value? Something like:

$scope.EstimatedValue = function(foo) {
    var value = doSomeCalculations();

    // store for usage elsewhere
    this.estimatedValuesCache[foo] = val;

    return val;
};

answered Jun 15, 2015 at 14:37

Agop

1,91717 silver badges23 bronze badges

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

1 Comment

user1894292 Over a year ago

Great. Thanks for this. To answer your question, I want to reuse my filter in other controllers so don't want to copy over a function.

Collectives™ on Stack Overflow

AngularJS - Can't use filter to set variable in view

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related