javascript - 使用 angularjs 进行动态函数调用

Question

我有一个数组

invitationList = ["A","B","C","D"]

从这个数组中，我需要形成一个名称为A/B/C/D的列表，按钮为accept。单击此接受按钮时，应调用接受函数。

我试过了，

 var list_Invitation='';
 list_Invitation="<ul class='offline-invitation'>";
 var i = 1;
    for(var index in invitationList)
        {
        i++;
        list_Invitation=list_Invitation+'<li class="class_InvitationList"><h5>'+invitationList[index]+'</h5><input type="button" class="accept-btn" value="Accept" ng-click="acceptInvitation(\''+invitationList[index]+'\', \'accept-btn'+i+'\');"/></li>';
        }
            list_Invitation=list_Invitation+"</ul>";


$scope.acceptInvitation=function(name,id)
  {
      console.log('Invoked');
  }

将显示列表，但单击按钮时无法调用该功能。

谁能帮我解决这个问题？

Answer 1

角度方式是

<ul class='offline-invitation'>
    <li class="class_InvitationList" ng-repeat="item in invitationList">
         <h5>{{item}}</h5>
        <input type="button" class="accept-btn" value="Accept" ng-click="acceptInvitation(item, $index)" />
    </li>
</ul>

然后在你的控制器中

$scope.invitationList = ["A", "B", "C", "D"];

$scope.acceptInvitation = function (name, id) {
    console.log('Invoked', name, id);
}

演示：小提琴