10

I'm messing with Lightning Components doing some very angular-ish things. I like that we can use two-way binding with the "updateon" tag.

Here's my code:

<aura:component >
  <aura:attribute name="number1" type="integer" default="2"/>
  <aura:attribute name="number2" type="integer" default="2"/>

  <div>this is a 2-way bind test</div>
  <ui:inputNumber label="Number 1" value="{!v.number1}" required="true" updateOn="keyup" />
  <ui:inputNumber label="Number 2" value="{!v.number2}" required="true" updateOn="keyup" />

  <ui:outputNumber  value="{!add(v.number1, v.number2)}"/>

I tried that expression being {!v.number1 + v.number2} first, and that didn't work.

What's REALLY strange is that defaulting them both to 2 in the attributes will start with 4 (not 22) as expected.

But once you do any typing in the inputs, it's just doing string concat: even if you change them both back to 2 it'll be 22. (insert Taylor Swift joke here:)

How do I keep them as integers? I could do this by building all sorts of setter/getter on the controller and casting, but I don't want to. I want to use just expressions like Angular can.

Tried so far: using the "format" parameter on the outputNumber. 22.0 there

2 Answers 2

9

There is a bug in the way that the components and expressions interact. The input field being used by the component is returning a string, and it's not properly coercing the value into the number (or other) type.

There are a couple of ways to workaround this, but keep in mind that neither of these examples are doing error checking, type validation, etc.:

  1. Multiple each value by 1:

    <ui:outputNumber value="{!(v.value1 * 1) + (v.value2 * 1)}"/>

  2. Use a change handler for the attribute value and coerce it as needed. This is obviously heavier-weight and more difficult to use.

1

try this in controller

({
    CalcSum : function(component) {

        var Sum=parseInt(component.get("v.number1"))+parseInt(
                 component.get("v.number2"));
        component.set("v.Sum",Sum);
    }
})

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .