Change the value of an attribute in an angular directive

Question

I've got a requirement such that for certain type of scope variables, I want to keep two decimal places in AngularJs. For this I've done the following:

html

<span floatval="{{someVariable}}">{{someVariable}}</span>

js

var app = angular.module('app',[]).directive('floatval', function(){ return function(scope, element, attrs){ var newInt = parseFloat(attrs.floatval); var n = newInt.toFixed(2); } });

I'm stuck here as I dont know how to now reflect this new value in the place of the original scope {{somevariable}}

Jonathan · Accepted Answer · 2015-03-30 08:15:01Z

You can specify the scope of your directive. This way two-way binding is setup.

var app = angular.module('app',[]).directive('floatval', function(){ return { scope: { floatval: '=' }, link: function(scope, element, attrs){ scope.floatval = parseFloat(scope.floatval).toFixed(2); } }; });

Then you need to change your HTML <span floatval="someVariable">{{someVariable}}</span>

See https://code.angularjs.org/1.3.15/docs/guide/directive

Link to an example plnkr : http://plnkr.co/edit/aRyp1v9tGH7z8X28fewP?p=preview

Does this work the same for version 1.2.x? Because I seem to be getting a syntax error using this.
You need to change your assignment from {{value}} to just value in your html view

Łukasz · Accepted Answer · 2015-03-30 08:12:29Z

0

Why don't you use built-in filters? https://docs.angularjs.org/api/ng/filter/number

answered Mar 30, 2015 at 8:12

Łukasz

6435 silver badges12 bronze badges

Collectives™ on Stack Overflow

Change the value of an attribute in an angular directive

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related