时间戳

首页 > 解决方案 > 是否可以将 AngularJS 函数存储在数组中并将函数放在 ng-click 中？

arrays - 是否可以将 AngularJS 函数存储在数组中并将函数放在 ng-click 中？

问题描述

我试图使用 Array 制作几个按钮。显示按钮，但数组中的功能不起作用。

var module = angular.module('app',[]);
module.controller('Ctrl',['$scope', function ($scope){
  $scope.data = [
  {link: "myNav.pushPage('page1')", btn:'Page 1'},
  {link: "myNav.pushPage('page2')", btn:'Page 2'},
  {link: "myNav.pushPage('page3')", btn:'Page 3'}
  ]
}])
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="app" ng-controller="Ctrl">
  <tr ng-repeat="x in data">
    <td><button ng-click="{{x.link}}">{{x.btn}}</button></td>
  </tr>
</div>

标签： arraysangularjsfunctionangularjs-ng-repeatangularjs-ng-click

解决方案

如果函数始终相同并且只有参数发生变化，则可以将参数放在data数组中并像这样传递它：

<table>
    <tr ng-repeat="x in data">
        <td><button ng-click="test(x.link)">{{x.btn}}</button></td>
    </tr>
</table>

使用这个数组：

$scope.data = [{
  link: "page1",
  btn: 'Page 1'
},
{
  link: "page2",
  btn: 'Page 2'
},
{
  link: "page3",
  btn: 'Page 3'
}]

检查工作演示：DEMO

推荐阅读