if i use ng-repeat in append html div, the content is not appending. how to get the label name key value on appended each fields. i want to change each label name from field label options from below code. click on appended div, it will shows filed label options, from there i have to change each label name seperately.. pls help me
var app = angular.module('myapp', ['ngSanitize']);
app.controller('AddCtrl', function ($scope, $compile) {
$scope.field = {single: 'untitled'};
$scope.addNew_SingleField = function (index) {
var singlehtml = '<fieldset ng-repeat="(fieldkey, field) in singleField" ng-click="selectSingle($field)"><label ng-bind-html="field.single"></label><input type="text" placeholder="Enter name" name="{{field.single}}"><button ng-click="removeSingle($index)">-</button></fieldset>';
var single = $compile(singlehtml)($scope);
angular.element(document.getElementById('drop')).append(single);
};
$scope.removeSingle = function (index) {
var myEl = angular.element(document.querySelector('#single_field'));
myEl.remove();
};
$scope.selectSingle = function (field) {
selectedField = field
$scope.showSingle_Fieldsettings = true;
};
});<!DOCTYPE html>
<html ng-app="myapp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0-beta.2/angular.min.js"></script>
<script src="https://code.angularjs.org/1.5.0-rc.0/angular-sanitize.min.js"></script>
</head>
<body ng-controller="AddCtrl">
<button ng-click="addNew_SingleField($index)">Single Line Text</button>
<div id="drop"></div>
<form ng-show="showSingle_Fieldsettings">
<div class="form-group">
<label>Field Label(?)</label>
<br/>
<input ng-model="selectedField.single" class="fieldLabel">
</div>
</form>
</body>
</html>