Question

I am trying to create a select element that has a list of numbers 1 to array total count. how to structure the ng-options expression so that it will give me the numbers I need?

<select ng-model="page" ng-options="???"></select>

what do I need to put in the ng-options expression in order for it to create my select like

<select>
    <option value="1">1</option>
    ...
    <option value="array length">array length</option>
</select>

JS code:

$scope.arrayName=
     {
       "ABC": [{
        "id": "a33e777fdc444222bfa7fab2baec17a0",
        "name": "music & store",
        "isDeletionAllowed": false,
        "isDeleted": false,
        "isEnabled": false,
        "language": "en"
    }, {
        "id": "9896710e6ac6454c96ec29e9a83355e4",
        "name": "music class",
        "isDeletionAllowed": false,
        "isDeleted": false,
        "isEnabled": false,
        "language": "en"
    }, {
        "id": "b65ab7e3fdc24e23851ffb2e940ff00f",
        "name": "music store",
        "isDeletionAllowed": false,
        "isDeleted": false,
        "isEnabled": false,
        "language": "en"
    }, {
        "id": "2a5e218ae77c4d6683ecea35266ccc24",
        "name": "net & store",
        "isDeletionAllowed": false,
        "isDeleted": false,
        "isEnabled": false,
        "language": "en"
    }, {
        "id": "f63b1cd96abb4f42962267af43dfe935",
        "name": "rock & class",
        "isDeletionAllowed": false,
        "isDeleted": false,
        "isEnabled": false,
        "language": "en"
    },
    "totalCount": 6
}

Answer 1

您可以使用如下所示，但我还没有测试它在运行时更改数组值。

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.years = ['1900', '1901', '1902', '34333'];
    $scope.newArray = Array.apply(null,$scope.years).map(function (_, i) {return i+1;});
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">


<select ng-model="chosenYear" ng-options="i for i in newArray"></select>
</div>



</body>
</html>

Answer 2

这样的事情：

JS

        var app = angular.module('plunker', []);

        app.controller('MainCtrl', function($scope) {

          $scope.arrayName=
             {
               "ABC": [{
            "id": "a33e777fdc444222bfa7fab2baec17a0",
            "name": "music & store",
            "isDeletionAllowed": false,
            "isDeleted": false,
            "isEnabled": false,
            "language": "en"
            }, {
            "id": "9896710e6ac6454c96ec29e9a83355e4",
            "name": "music class",
            "isDeletionAllowed": false,
            "isDeleted": false,
            "isEnabled": false,
            "language": "en"
            }, {
            "id": "b65ab7e3fdc24e23851ffb2e940ff00f",
            "name": "music store",
            "isDeletionAllowed": false,
            "isDeleted": false,
            "isEnabled": false,
            "language": "en"
            }, {
            "id": "2a5e218ae77c4d6683ecea35266ccc24",
            "name": "net & store",
            "isDeletionAllowed": false,
            "isDeleted": false,
            "isEnabled": false,
            "language": "en"
            }, {
            "id": "f63b1cd96abb4f42962267af43dfe935",
            "name": "rock & class",
            "isDeletionAllowed": false,
            "isDeleted": false,
            "isEnabled": false,
            "language": "en"
            }],
            "totalCount": 6
        };

        function getMyArray (){
          var arr = Array.apply(null, Array($scope.arrayName.totalCount));
          return arr.map(function (x, i) { return i+1 });
        }

        $scope.myArray = getMyArray();
        $scope.page = $scope.myArray[0];

        });

HTML：

<select ng-model="page" ng-options="o for o in myArray"></select>

工作Plunkr here

参考文献：https://www.undefinednull.com/2014/08/11/a-brief-walk-through-of-the-ng-options-in-angularjs/

http://www.2ality.com/2013/11/initializing-arrays.html

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

How to get dropdown value(Range of array count)?

2 个答案: