javascript - AngularJs - 动态显示按钮的最佳方式是什么？

Question

我是 angularJs 的新手。有人能给我指出从 angularJs 到 html 动态显示链接的简单且最佳的方法吗？

我想在 html 中动态显示“n”(n>=0)个按钮，其中我从数据库获取“n”的值。假设如果n是5，当我加载html页面时应该显示5个按钮，而且我想知道用户单击了哪个按钮。

任何指示都会非常有帮助。

Answer 1

您可以通过使用“ng-repeat”指令来实现此目的。

尝试下面的代码:

HTML:

<div ng-app="app">
<div ng-controller="AppCtrl">
    <button ng-repeat="n in getArray(number)" id="button-{{$index}}" ng-click="getButtonClicked($index)" >This button repeats times</button>
</div>

脚本:

var myApp = angular.module('app',[]);
        myApp.controller('AppCtrl' , function($scope){
            $scope.number = 5;
            $scope.getArray = function(num){
                var array = [];
                for(var i = 0 ; i < num;i++){
                    array[i] = i +1;
                }
                return array;
            }
            $scope.getButtonClicked = function(buttonNumber){
                alert(buttonNumber + 1 + " is clicked");
            }
        });