ngModel does not display dynamic field value

Asked

Viewed 151 times

1

In a function that includes dynamic fields, I am unable to display the product value when typed.

If I do only with an input displays normal value but with dynamic fields I cannot display, follow the code:

$scope.somaOS = function(valor) {
  $scope.totalOS = parseFloat(valor);
};

$scope.inputs = [];
$scope.add = function(valor, desc) {
  var dataObj = {
    desc: desc,
    valor: valor
  };
  $scope.inputs.push(dataObj);
}
<div class="form-group col-md-4">
  <small class="d-block"><b>VALOR PRODUTOS</b></small>
  <span class="text-info font-weight-bold display-30">{{valor | currency}}</span>
</div>

<div id="produto" class="tab-pane">
  <div class="row">
    <div class="form-group col-md-2 mt-5 p-2">
      <button class="btn btn-info btn-sm" ng-click="add()"><i class="fa fa-plus"></i> Adicionar Campo</button>
    </div>
  </div>
  <div class="row">
    <div class="form-group col-md-6 input-group-sm">
      <label class="col-form-label">Descrição Produto</label>
      <div ng-repeat="input in inputs">
        <input class="form-control text-uppercase mb-1" ng-model="input.desc" name="upOSProd[]">
      </div>
    </div>
    <div class="form-group col-md-4 input-group-sm">
      <label class="col-form-label">Valor Produto</label>
      <div ng-repeat="input in inputs">
        <input class="form-control text-uppercase mb-1 input-group-sm" ng-model="input.valor" name="upOSProdValor[]" money-mask ng-keyup="somaOS(valor)">
      </div>
      {{valor}}
    </div>
  </div>
</div>

What could I be doing wrong?

angularjs

1 answer

0

I believe the error may be in those lines:

<input class="form-control text-uppercase mb-1 input-group-sm" ng-model="input.valor" name="upOSProdValor[]" money-mask ng-keyup="somaOS(valor)">

<input class="form-control text-uppercase mb-1" ng-model="input.desc" name="upOSProd[]">

Have you ever tried to replace input desc. for inputs.desc or else put the value in full ( $Scope.inputs.desc )

  • 1

    Note: I could check if this is it, if not comment I will edit the answer to something else you can try to do

  • as you said worked (inputs.desc), but as inputs are dynamic when typing in one field changes the other also because inputs will always have the same ng-model. What’s the best way to solve this

  • I recommend taking a look at this video: <https://www.youtube.com/watch?v=rlVxG2lG1Tk&list=PLGxZ4Rq3BOBoSRcKWEdQACbUCNWLczg2G&index=10as it explains when to use ngModel, Property Binding and Interpolation

  • Another lesson of hers that I recommend <https://www.youtube.com/watch?v=WF28rLBangw&list=PLGxZ4Rq3BOBRcKWEdQACbUCNWLczg2G&index=12> I think this class suits your need more at approximately 6 minutes explains a good way to do what you want

Browser other questions tagged angularjs

You are not signed in. Login or sign up in order to post.