在动态添加的html元素中使用$scope变量添加动态ID

请查看下面的代码，并帮助我纠正错误：

$scope.more_work_counter=0;
$scope.appendWork = function(){
  $scope.more_work=$sce.trustAsHtml($scope.more_work+'<input type="text" class="form-control more-work-fields" id="{{more_work_counter}}"><button class="btn btn-danger del-more-work-btn">-</button>'+'</br>');
  $scope.more_work_counter++;
}

$scope.more\u work\u counter=0；
$scope.appendWork=函数（）{
$scope.more_work=$sce.trustAsHtml（$scope.more_work+'-'+'
'）；
$scope.more_work_counter++；
}

下面是我的DOM图像以及我想添加到输入字段中的ID：

---

好的，我这样做了，效果很好。。。php中多次使用的旧技术

$scope.appendWork = function(){

        $scope.more_work=$sce.trustAsHtml($scope.more_work+'<input type="text" class="form-control more-work-fields" id="'+$scope.more_work_counter+'"><button class="btn btn-danger del-more-work-btn">-</button>'+'</br>');
        $scope.more_work_counter++;

    }

$scope.appendWork=function（）{
$scope.more_work=$sce.trustAsHtml（$scope.more_work+'-'+'
'）；
$scope.more_work_counter++；
}

根据示例代码判断，您可能需要添加更多字段以显示在html中。你可以使用ng repeat指令，检查我做了什么

控制器代码：

  $scope.fields = [
    {id: 1}
    ];

    $scope.addField = function(){
       $scope.fields.push({
         id : $scope.fields.length
       });
    }

html

-
添加字段

您想在html中实现什么？我不确定您想实现什么，但这肯定是错误的。HTML代码应该在模板中。它应该根据指令（ng repeat等）生成，并根据模型中的更改进行自我更新。模型应该是JavaScript对象和数组。我试图在按下某个按钮时动态添加html元素（输入和按钮）。要根据生成的数量为这些输入和按钮分配一些动态ID，请查看我的演示-，确实如此哦，我明白了，我得到了你的方法，谢谢你的帮助@谢谢你的帮助，我想你小姐明白我的问题了。我想在用户按下“添加”按钮时添加新字段，这样ng repeat就不起作用了：）嗯，“在用户按下“添加”按钮时添加新字段”——这正是演示中发生的情况。然而you@shujaat1989这就是这个示例所做的。当您单击“addfield”时，模型中会添加一个新字段，并且由于html模板会在字段上迭代，并使用ng repeat为每个字段生成一个输入和一个按钮，因此它正是您想要实现的。

<div ng-repeat="field in fields">
  <input type="text" class="form-control more-work-fields" id="{{$index}}">
  <button class="btn btn-danger del-more-work-btn">-</button>
</div>  
<button ng-click="addField()">add field</button>