动态创建多个输入字段。他们提交到一个数组

我创建了一个的jsfiddle：check it out 动态创建多个输入字段。他们提交到一个数组

当前，在创建范围时，他们不是孤立的。因此，如果我创建两个输入字段并在其中一个字段中输入，则在辅助输入字段中复制文本。

如何创建多个输入，分别填写并同时提交？

HTML

<div ng-app="miniapp" ng-controller="MainCtrl"> 
    <a href="" data-clicker>add inputs</a> 
    <form ng-model="project" ng-submit="addPage()"> 
     <div class="sections"></div> 

     <input type="submit" value="submit"/> 
    </form> 

    <hr> 
    <hr> 
    <p>project: {{project.name | json}}</p> 
    <p>output: {{output | json}}</p> 
</div>

var $scope; 
var app = angular.module('miniapp', []); 

app.directive('clicker', function($compile) { 
    'use strict'; 

    return { 
     compile: function(tElement, tAttrs) { 
      //var t = '<div data-pop>Pop</div>'; 
      var t = '<div><input type="text" ng-model="project.name"></div>'; 

      return function(scope, iElement) { 
       iElement.click(function() { 
        $('.sections').append($compile(t)(scope)); 
       }); 
      }; 
     } 
    } 
}); 



app.controller('MainCtrl', function($scope) { 
    $scope.project = {"name":"sup"}; 
    $scope.output = []; 
    $scope.addPage = function() { 
    $scope.output.push(_.clone($scope.project)); 
    }; 


});

我觉得我已经尝试了一切...它只是在我的逻辑缺陷？如果是这样，你能告诉我一个根据下面的用户流程工作的例子吗？

用户流量 enter image description here

来源

2014-02-13 Matthew Harwood

您应该使用Angular的ng-repeat指令遍历一个对象数组并通过数据绑定生成输入字段。

下面是使用该指令代码的简化版本：http://jsfiddle.net/89AYX/42/

含伍重复，块内的一切变成获取阵列模式的每一次迭代自动编译模板。把它想象成一个for-each循环，在数组更改时自动更新。

<div ng-repeat="project in projects"> 
    <input type="text" ng-model="project.name"/> 
</div>

正如可以看到的，project变量变为块作为阵列中的参考对象内访问。然后可以使用该引用在输入字段上使用该特定对象的属性创建双向绑定。

Angular带有大量有用的内置指令，可解决涉及数据绑定的大量常见问题。一定要查看他们的API参考，看看有什么可用的。

来源

2014-02-13 07:17:51

我完成了所有事情。感谢您的接地我。 –

当你创建你在同一个模型属性附加到它project.name

var t = '<div><input type="text" ng-model="project.name"></div>';

交换机，访问不同的属性为每个新的输入。或者创建一个属性数组，如果可以的话

来源

2014-02-13 02:01:59

有关如何实际完成此操作的任何见解？我没有线索......我已经太深了。 –

动态创建多个输入字段。他们提交到一个数组

回答

相关问题