CODEWITHSUNDEEP
javascripthtmlangularjsdata-binding
FreshWaterTaffy
FreshWaterTaffy

Reputation: 270

Angular data binding with calculation

This seems like a pretty simple question but I haven't been able to find the answer anywhere.

When using data binding in AngularJS as such:

<iframe height="{{bodyHeight}}"> </iframe>

I just want to subtract a number from bodyHeight similar to:

<iframe height="{{bodyHeight - 90}}"> </iframe>

I was hoping to do so without using javascript.

Upvotes: 1

Views: 1273

Answers (2)

FreshWaterTaffy
FreshWaterTaffy

Reputation: 270

I figured out what I was doing wrong. bodyHeight was being passed in as a number with px on the end like: 1280px.

So I just changed it to 1280 then the data binding is:

<iframe height="{{bodyHeight - 90}}px"> </iframe>

Pretty silly but I'll leave this here anyways for reference.

Upvotes: 1

Mark Pieszak - Trilon.io
Mark Pieszak - Trilon.io

Reputation: 66921

What you have actually works!

You are able to do calculations and other javascript within angularJS's {{ }} data-binding!

From the angularJS documentation

Angular expressions are JavaScript-like code snippets that are usually placed in bindings such as {{ expression }}.

For example, these are valid expressions in Angular:

1+2

a+b

user.name

items[index]

Upvotes: 2

Related Questions