comment ajouter ng-model aux champs de texte d'entrée créés dynamiquement

Le problème est que vos champs de saisie ajoutés dynamiquement n'ont pas d'événement de clic lorsque vous les ajoutez avec jQuery. Ajout de ng-click n'est pas assez. Vous devrez utiliser $compile pour laisser angular analyser cet élément.

Cependant, le moyen le plus intelligent consiste à ne pas utiliser du tout jQuery et à laisser les champs être générés par angular lui-même avec ng-repeat .

angular
  .module('app', [])
  .controller('dynamicFieldsController', dynamicFieldsController);

dynamicFieldsController.$inject = ['$scope'];

function dynamicFieldsController($scope){
  var vm = this;
  vm.numOfFields = 0;
  vm.fields = [];
  vm.add = function() {
    for (var i = 0; i < vm.numOfFields; i++) {
        var index = vm.fields.length;
        vm.fields.push(index);
    }
  }
}

input{
  display: block;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='app' ng-controller='dynamicFieldsController as vm'>
  <input placeholder='num of fields' ng-model='vm.numOfFields'>
  <button ng-click='vm.add()'>add</button>
  <input type='text' ng-repeat='field in vm.fields' value='{{ field }}'>
</div>

Dans cet exemple, vous pouvez ajouter n'importe quel nombre d'éléments et lier ng-click événements à eux. Ils fonctionneront hors de la boîte, car analysés avec angular. Vos addValues la fonction doit maintenant simplement utiliser vm.fields pour réellement ajouter les valeurs à la base de données.