Génération dynamique de la forme des champs de saisie et de collecte de données de terrain dans un tableau

Je suis coincé avec cette petite tâche.
J'ai besoin de générer des champs de saisie de façon dynamique en cliquant sur "ajouter" bouton sur le formulaire.
La forme est censée créer DB schéma de la table. Ainsi, chaque champ de saisie est un nom de champ de la table DB.

Je suis OK générer les champs dynamiquement, mais ont de la difficulté à réunir les données réelles.

<form ng-controller="NewTableCtrl" ng-submit="submitTable()">
  <input type='text' ng-model='table.title' placeholder='Title:'>
  <input ng-repeat="field in fields" type='text' ng-model='table.fields' placeholder='Field:'>
  <div>
    <button type='submit'>Submit</button>
    <button ng-click="addFormField()">Add</button>
  </div>
</form>

.. et le contrôleur

.controller('NewTableCtrl', function($scope) {
  $scope.fields = [];
  $scope.table = {};

  $scope.addFormField = function () {
    $scope.fields.push({});
  }

  $scope.submitTable = function () {
    console.log($scope.table);
  }
});

L'air simple. Lorsque je clique sur le bouton "Ajouter" qu'il génère le nouveau champ de saisie, mais il le fait avec le même modèle objet (obveously). Et c'est là où mon incompréhension réside. J'ai pensé que si je déclare $scope.fields = [];dans le contrôleur, puis en répétant les données de champ il suffit d'aller dans le tableau. Mais il a juste fait écho à l'entrée dans chaque répétition champ de saisie. Je comprends maintenant que c'est la façon dont il est censé être avec une liaison bidirectionnelle.

La raison pour laquelle je pensais que comme c'est par l'analogie avec un simple formulaire de soumission où la répétition champ de saisie de noms de devenir un tableau dans l'URL sous forme codée des données.

Alors, comment puis-je résoudre ce problème? Le serveur a besoin d'obtenir un tableau de champs comme ceci: fields: [field1, field2 ...] ai-je besoin pour générer des champs de saisie avec différents portée variable pour chaque champ? Comment puis-je faire cela?

Est-ce plus complexe alors que je pensais et il doit être une directive? Si oui, s'il vous plaît, montrez-moi comment faire.

Grâce.

OriginalL'auteur r.sendecky | 2014-04-30

Leave a Reply

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *