在angularjs克隆元素 [英] Clone elements in angularjs

问题描述

我需要重复某些输入字段以从客户端处理的数据。我曾用jQuery http://jsfiddle.net/m7R3f/1/

I need to duplicate some input fields in order to handle data from clients. I have done it with jQuery http://jsfiddle.net/m7R3f/1/

HTML

<fieldset id="fields-list">
<div class="pure-g entry">
    <div class="pure-u-1-5">
        <input type="text" class="pure-input-1" id="input-1" name="input-1">
    </div>
    <div class="pure-u-1-5">
        <input type="text" class="pure-input-1" id="date" name="date">
    </div>
    <div class="pure-u-1-5">
        <input type="text" class="pure-input-1" id="input-2" name="input-2">
    </div>
</fieldset>
<button id="add">Add</button>

JS

$(document).ready(function ()
{
    $("#add").click(function ()
    {
        $(".entry:first").clone(false).appendTo("#fields-list");
    });
});

不过我刚开始学习角，并希望这些code转变为角。
我已阅读在计算器的问题，找到了code这里angularjs： http://jsfiddle.net / roychoo / ADukg / 1042 / 。不过，它似乎只为一个输入字段的作品？我可以克隆/重复使用AngularJS几个输入字段？ （换言之：转换我的code以上到AngularJS版本？）
非常感谢你。

However I just start learning Angular and want to convert these code to Angular. I have read questions in stackoverflow and found the code with angularjs here: http://jsfiddle.net/roychoo/ADukg/1042/. However, it seem works only for ONE input field? Can I clone/duplicate several input fields using AngularJS? (in other word: convert my code above into AngularJS version?) Thank you very much.

推荐答案

您应该创建一个数组，并使用 NG-重复在你的HTML。数组中的每个对象都可以包含需要填充您的div的数据。如果你想开始三个条目，然后添加数据，这三个。如果你想添加更多，然后简单地推到数组。由于一旦元素被压入阵角的2路数据绑定你的表单字段将出现。

You should create an array and use ng-repeat in your HTML. Each object in the array can contain the data necessary to populate your divs. If you want to start with three entries, then add the data for those three. If you want to add more, then simply push onto the array. Because of Angular's 2-way data binding your form field will appear once the element is pushed onto the array.

有关如何做到这一点的详细信息，签上角的主页中做例子。

For more details on how to do this, checkout the To Do example on Angular's home page.

这篇关于在angularjs克隆元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！