$rootScope variable value not upating in Angular filter

Question

we're currently upgrading from Angular 1.2X to 1.4X and are experiencing a weird behavior change in terms of using filters.

I've made an example on plunkr: http://plnkr.co/edit/iVABuG5ApiwgyV6RRwQA?p=preview

  .filter('convert', function($rootScope) {
    return function(input) {
      var out = parseInt(input) * $rootScope.convert_rate;
      return out;
    };
  })

Basically, we're taking a value (e.g. 5) and multiplying it by a conversion rate, via a filter. The conversion rate is specified in a $rootScope variable.

In Angular 1.2X (check that Angular 1.2x is defined in index.html), the filter runs and the value updates when you change the conversion rate.

In Angular 1.5 beta, when the conversion rate is changed, the filter does not run and the value does not update.

Does anyone know why this happens?

i think it is because of changes in filter functionality. i found one answere stackoverflow.com/a/20203059/4944490 you can visit this link — Krupesh Kotecha
– Krupesh Kotecha, Commented Oct 9, 2015 at 12:23

Túlio Castro · Accepted Answer · 2015-10-09 12:56:54Z

1

The problem is because angular instance $filter just once, so your $rootScope in your filter will be old. The best way is just pass your convert_rate as argument to your filter.

See this plunker i've made for you http://plnkr.co/edit/yNea42CeBBG2KNEmugku?p=preview

//In your filter
.filter('convert', function() {
return function(input, convert_rate) {
  console.log(input);
  var out = parseInt(input) * convert_rate;
  return out;
};
})

//Your HTML

{{original_value | convert: convert_rate}}

answered Oct 9, 2015 at 12:56

Túlio Castro

1,32310 silver badges17 bronze badges

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

Comments

Magus · Accepted Answer · 2015-10-09 12:24:02Z

0

In recent versions of Angular (1.4 or 1.5, i can't say), when you modify a value in $rootScope, Angular don't trigger the digest cycle. So you have to call it yourself :

$rootScope.convert_rate = new_value;
$rootScope.$apply();

answered Oct 9, 2015 at 12:24

Magus

15.1k4 gold badges40 silver badges52 bronze badges

Comments

Gaurav Sachan · Accepted Answer · 2015-10-09 13:22:05Z

0

You just need to pass convert_rate in filter parameter, everything will remain same.

Value: {{original_value | convert:convert_rate}}<br> 
filter('convert', function($rootScope) {
    return function(input,convert_rate) {
      var out = parseInt(input) * convert_rate;
      return out;
    };
  })

here is the plunker

answered Oct 9, 2015 at 13:22

Gaurav Sachan

3201 silver badge10 bronze badges

Collectives™ on Stack Overflow

$rootScope variable value not upating in Angular filter

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related