使用 angular js 创建下拉菜单
Creating a drop-down menu with angular js
我想为用户 select 获取各种操作系统的下拉列表。到目前为止,这是我的代码
<form id="main">
<table>
<tr>
<td class="display_bold"><label for="name">VM Name:</label></td>
</tr>
<tr>
<td class="display"><input type="text" ng-model="virMachine.vmName" size="40"></td>
</tr>
<tr>
<td class="display_bold" ><label for="name">OS Type:</label></td>
</tr>
<tr>
<td class="display"><input type="text" ng-model="virMachine.osVersion" size="40"></td>
</tr>
</table>
这是我要从中创建下拉菜单的 OS 列表。
$scope.operatingsystems = ["Ubuntu-16", "Centos 7", "Wimdows"];
我该怎么做?我知道我可能已将输入类型从文本更改为其他类型但不确定是什么。
Angular.js 中的下拉菜单可能如下所示:
<select ng-model="osType">
<option value=" ">Choose OS</option>
<option ng-repeat="o in operatingsystems">{{o}}</option>
</select>
只要你能做到,
<select ng-model="osType">
<option ng-repeat="os in operatingsystems">{{os }}</option>
</select>
演示
angular.module('myApp',[]).controller('studentController', function($scope){
$scope.operatingsystems = ["Ubuntu-16", "Centos 7", "Wimdows"];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="studentController">
<table>
<tr>
<td class="display_bold"><label for="name">VM Name:</label></td>
</tr>
<tr>
<td class="display"><input type="text" ng-model="virMachine.vmName" size="40"></td>
</tr>
<tr>
<td class="display_bold"><label for="name">OS Type:</label></td>
</tr>
<tr>
<td class="display"><select ng-model="osType">
<option ng-repeat="os in operatingsystems">{{os }}</option>
</select></td>
</tr>
</table>
</div>
</body>
我想为用户 select 获取各种操作系统的下拉列表。到目前为止,这是我的代码
<form id="main">
<table>
<tr>
<td class="display_bold"><label for="name">VM Name:</label></td>
</tr>
<tr>
<td class="display"><input type="text" ng-model="virMachine.vmName" size="40"></td>
</tr>
<tr>
<td class="display_bold" ><label for="name">OS Type:</label></td>
</tr>
<tr>
<td class="display"><input type="text" ng-model="virMachine.osVersion" size="40"></td>
</tr>
</table>
这是我要从中创建下拉菜单的 OS 列表。
$scope.operatingsystems = ["Ubuntu-16", "Centos 7", "Wimdows"];
我该怎么做?我知道我可能已将输入类型从文本更改为其他类型但不确定是什么。
Angular.js 中的下拉菜单可能如下所示:
<select ng-model="osType">
<option value=" ">Choose OS</option>
<option ng-repeat="o in operatingsystems">{{o}}</option>
</select>
只要你能做到,
<select ng-model="osType">
<option ng-repeat="os in operatingsystems">{{os }}</option>
</select>
演示
angular.module('myApp',[]).controller('studentController', function($scope){
$scope.operatingsystems = ["Ubuntu-16", "Centos 7", "Wimdows"];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="studentController">
<table>
<tr>
<td class="display_bold"><label for="name">VM Name:</label></td>
</tr>
<tr>
<td class="display"><input type="text" ng-model="virMachine.vmName" size="40"></td>
</tr>
<tr>
<td class="display_bold"><label for="name">OS Type:</label></td>
</tr>
<tr>
<td class="display"><select ng-model="osType">
<option ng-repeat="os in operatingsystems">{{os }}</option>
</select></td>
</tr>
</table>
</div>
</body>