如何使用 angularJs 打印 table 个数字？

Question

我是 angularJs 的初学者。我想根据插入到文本框中的值打印一个数字 table。这是我的代码

<html>

    <head>
        <script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
    </head>

    <body>

        <div ng-app="" ng-controller="number1">
            Number: <input type="text" ng-model="num1"><br>
            <br>

                <p>{{num1}}</p>

        </div>

        <script>
            function number1($scope) {
            for(var i; i<=10;i++){
                $scope.num1 = 1*i
                        }

            }
        </script>

    </body>
</html>

Answer 1

您可以使用 ngRepeat 遍历数组中的每个数字并呈现乘法结果 {{num1 * i}}。

例如它可能是这样的：

<input type="text" ng-model="num1" />

<table class="table table-bordered">
    <tbody>
        <tr>
            <td>*</td>
            <td ng-repeat="i in numbers">{{i}}</td>
        </tr>
        <tr>
            <td>{{num1}}</td>
            <td ng-repeat="i in numbers">{{i*num1}}</td>
        </tr>
    </tbody>
</table>

其中 numbers 在控制器中声明：

$scope.numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

这里有一个小演示来进行实验：http://plnkr.co/edit/TXKzszn2t6sHHkPNNkqk?p=info

Answer 2

       <div ng-app="" ng-controller="number1">
                Number: <input type="text" ng-model="num1"><br>
                <br>
                <div ng-repeat="n in [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]">
                    <p>{{num1}}*{{n}}={{num1 * n}}</p>
                </div>
            </div>
    
            <script>
                function number1($scope) {
                    $scope.num1 = "1",
                }
            </script>

或

<div ng-app="" ng-controller="number1">
            Number: <input type="text" ng-model="num1"><br>
            <br>
            <div ng-repeat="n in numbers">
                <p>{{num1}}*{{n}}={{num1 * n}}</p>
            </div>
        </div>

        <script>
            function number1($scope) {
                $scope.num1 = "1",
                $scope.numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
            }
        </script>

如何使用 angularJs 打印 table 个数字？

How to print a table of numbers using angularJs?

javascript

angularjs

angularjs-directive

或