如何在使用 angular repeat 和 html 文件作为 repeat 时创建唯一 ID

How to create unique id's when using angular repeat with a html file as repeat

public int Order { get; set; }
        public string Name { get; set; }
        public string NameCode { get; set; }
        public string NextSectionCode { get; set; }
        public IEnumerable<string> AddText { get; set; }
        public IEnumerable<string> Languages { get; set; }
        public string TemplateUrl { get; set; }
        public string SummaryTemplateUrl { get; set; }
        public string TypeCode { get; set; }
        public int Min { get; set; }
        public int Max { get; set; }
        public string AddendumName { get; set; }
        public string AddendumDescription { get; set; }
        public bool DisplayOnly { get; set; }
        public ValidationConfiguration Validation { get; set; }
        public IDictionary<string, SectionConfiguration> Subsections { get; set; }- My service class

 agreementApiSvc.getAllWizardSections($scope.agreement.Id).then(function (response) {
            $scope.sections = response.data;
            var i = 0;
            angular.forEach($scope.sections, function (section) {
                if (!section.DisplayOnly) {

                    section.Index = i;
                    i++;
                }
                if (section.SummaryTemplateUrl) {
                    $scope.$watch(function () { return section.IsLoaded === true; }, function () {
                        $scope.sectionsLoaded++;
                        

<!-- begin snippet: js hide: false console: true babel: false -->

<div ng-repeat="section in sections | orderBy: Order">
            <agreement-summary-section id="agreement-summary-section-{{$index}}-{{section.NameCode}}" section="section" ng-disabled="isDisabled" enabled-in-amend-mode="enabledInAmendMode && !isUnderReview" agreement-status="currentAmendmentStatus"
               check-agreement-validity="checkAgreementValidity" is-enabled-in-name-change-mode="isEnabledInNameChangeMode" company-staging-status-progress="companyStagingStatusProgress"/>
        </div>

我使用了一个 html 文件,其中控制器的 ng-repeat 带有 html 页面作为 "TemplateUrl"...它一切正常,但 id 在 html 文件重复,请问如何解决这个问题。

(function(angular) {
  'use strict';
angular.module('ngRepeat', []).controller('repeatController', function($scope) {
  $scope.friends = [
    {name:'John', age:25, gender:'boy'},
    {name:'Jessie', age:30, gender:'girl'},
    {name:'Johanna', age:28, gender:'girl'},
    {name:'Joy', age:15, gender:'girl'},
    {name:'Mary', age:28, gender:'girl'},
    {name:'Peter', age:95, gender:'boy'},
    {name:'Sebastian', age:50, gender:'boy'},
    {name:'Erika', age:27, gender:'girl'},
    {name:'Patrick', age:40, gender:'boy'},
    {name:'Samantha', age:60, gender:'girl'}
  ];
});
})(window.angular);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js"></script>
</head>
<body ng-app="ngRepeat">
  <div ng-controller="repeatController">
  I have {{friends.length}} friends. They are:
  
  <ul class="example-animate-container">
    <li class="animate-repeat" ng-repeat="friend in friends">
      [{{$index + 1}}] {{friend.name}} who is {{friend.age}} years old.
    </li>
    <li class="animate-repeat" ng-if="results.length === 0">
      <strong>No results found...</strong>
    </li>
  </ul>
</div>
</body>
</html>