Question

我有一个显示下拉菜单的html页面。下拉列表是一个集合的集合，所以我想使用ng-options问题是我需要预先选择一个值。下面是代码的html部分

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <script type="text/javascript" src="test.js"></script>
</head>
<body>
    <form id="frmTest" ng-app="enc" ng-controller="encMain">
        <select ng-model="SelectedIds" ng-change="manufactureSetup()" ng-options="item as item.ManufactureDate for item in manufactures track by item.ManufactureIds"> </select>
    </form>
</body>
</html>

下面是JavaScript代码

var app = angular.module('enc', []);
app.controller('encMain', function ($scope) {

    $scope.manufactures = [];
    $scope.selectedIds = '';

    function addManufacture(manufactureIds, manufactureDate) {
        return {
            ManufactureIds: manufactureIds,
            ManufactureDate : manufactureDate
        }
    }

    var ids = [1, 2];
    var id1s = [3, 4];

    $scope.manufactures.push(new addManufacture('', 'All Dates'));
    $scope.manufactures.push(new addManufacture(ids, '10JUN2018'));
    $scope.manufactures.push(new addManufacture(id1s, '12JUN2018'));

    $scope.manufactureSetup = function () {
        alert('setup');
    }
});

问题是我需要在下拉列表中预先选择“所有日期”。不确定如何实现此功能。请帮忙。谢谢

在angular js中使用ng-options预选择一个值

0 个答案: