anuglar jsを使用してボタンのクリックで動的入力フィールドを作成するにはどうすればよいですか？

Question

私はこの

のようなドロップダウンメニュー[ShortAnswer-テキストボックス、チェックボックス、ラジオボタンとドロップダウン] ユーザが入力タイプを選択することができますし、追加のオプションボタンをクリックしてオプションをそこに追加することができますがありますこのように

をクリックすると、オプションを削除する必要があります。

私はdynamic text area

http://viralpatel.net/blogs/dynamic-add-textbox-input-button-radio-element-html-javascript/ 

をrefferedしかし、私はこれについての詳細を参照する必要がある、私に角度JSを使用して、これを達成するためのアイデアを提案してください。

Answer 1

入力を定義するオブジェクトの配列から入力リストを作成します。ボタンをクリックして、追加する入力を定義する新しいオブジェクトを配列に追加します。

HTML：

<div ng-repeat="input in inputsList"> 
    <span ng-click="remove($index)>x</span><input ng-if="input.type==='text'" type="text" /> 
    <span ng-click="remove($index)>x</span><input ng-if="input.type==='checkbox'" type="checkbox" /> 
    ... 
</div> 
<button ng-click="addNewCheckBox()">Add</button> 

コントローラ：あなたはconfigオブジェクトを取ったカスタム入力ディレクティブを持っていたし、それを構築するために、どの入力を決めるならばそれはおそらく最高だろう

$scope.addNewCheckBox = function() { 
    $scope.inputsList.push({ type: 'checkbox' }); 
}; 

$scope.remove = function(index) { 
    $scope.inputsList.splice(index, 1); 
}; 

。しかし、わかりやすく簡潔にするために、基本的な生のhtml入力を使用しました。

それが理にかなっているか、Angular2/4の回答が必要かどうかを教えてください。