Joao Henrique
Joao Henrique

Reputation: 33

Use angular-input-mask twice time followed

In this code:

<div class="list">
    <label class="item item-input">
        <span class="input-label">CEP Origem: </span>
        <input type="text" id="origem" ng-model="cep" ui-br-cep-mask>
    </label>
    <label class="item item-input">
        <span class="input-label">CEP Destino: </span>
        <input type="text" id="destino" ng-model="cep" ui-br-cep-mask>
    </label>
</div>

When I completed any one of the two the other have the same value, how can I change this?

Upvotes: 0

Views: 181

Answers (3)

Mistalis
Mistalis

Reputation: 18279

ng-model defines the variable that will be edited by your input.

So, if your inputs have the same ng-model, it will edit the same variable.


Here you just have to change the ng-model of your second input:

<input type="text" id="origem" ng-model="cep1" ui-br-cep-mask>
<input type="text" id="destino" ng-model="cep2" ui-br-cep-mask>

Upvotes: 0

IamSilviu
IamSilviu

Reputation: 232

Because both have the same model, provide different model for each input will solve this issue. You can also use object and bind the keys.

<div class="list">
  <label class="item item-input">
    <span class="input-label">CEP Origem: </span>
    <input type="text" id="origem" ng-model="cep.origem" ui-br-cep-mask>
  </label>
  <label class="item item-input">
    <span class="input-label">CEP Destino: </span>
    <input type="text" id="destino" ng-model="cep.destino" ui-br-cep-mask>
    </label>
</div>

Upvotes: 1

j_freyre
j_freyre

Reputation: 4738

This is simply because both of your inputs are using the same ng-model. Simply set a different one should help you

Upvotes: 0

Related Questions