简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > JS Tutorial > body text

AngularJS drop-down box (method 3)

黄舟
Release： 2017-02-18 13:54:12
Original
1101 people have browsed it

1. Problem background

Generally speaking, the drop-down box is divided into value and description, value is bound to the value, in the middle Description


2. Implementation source code

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>AngularJS之下拉框（方式三）</title>
		<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
		<style>
			body,html,p{
				width: 99%;
				height: 99%;
				font-family: "微软雅黑";
				font-size: 16px;
			}
		</style>
		<script>
			var app = angular.module("selectApp",[]);
			app.controller("selectController",function($scope){
				$scope.student = [
					{stuNo:"2016010101",stuName:"张三"},
					{stuNo:"2016010102",stuName:"李斯"},
					{stuNo:"2016010103",stuName:"蝴蝶"},
					{stuNo:"2016010104",stuName:"利是"},
					{stuNo:"2016010105",stuName:"肇庆"},
					{stuNo:"2016010106",stuName:"思胡"}
				];
			});
		</script>
	</head>
	<body ng-app="selectApp" ng-controller="selectController">
		<p style="text-align: center;vertical-align: middle;">
			<select style="width: 200px;">
				<option ng-repeat="stu in student" value="{{stu.stuNo}}">
					{{stu.stuName}}（{{stu.stuNo}}）
				</option>
			</select>
		</p>
	</body>
</html>
Copy after login


3. Implementation result

AngularJS drop-down box (method 3)

The above is the content of the AngularJS drop-down box (method three). For more related information, please Follow the PHP Chinese website (www.php.cn)!


Related labels：
AngularJS，下拉框
source：php.cn
Previous article：Gaode Map-Plot outbound and return routes Next article：AngularJS timer (interval)
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Uncaught syntax error when parsing JSON on response using AJAX request: Unexpected token '<', "<br /> I'm using datefrom and dateto to make a dropdown menu and then display the dates between t...
From 2023-11-01 10:06:57
0
1
269
Mysql query: reduce value by 1 I want to decrement the value contained in a field (integer or dropdown) by 1. I tried the...
From 2023-10-25 10:57:45
0
3
289
Update multiple rows of data using PDO loop I have a form that retrieves multiple rows of data, each item has a text area for users to...
From 2023-10-24 09:38:58
0
2
296
CSS Tips: How to Style Checkboxes Using CSS I'm trying to style a checkbox using: <inputtype="checkbox" style="borde...
From 2023-10-08 16:37:48
0
2
325
Select jQuery element $input._flatpicker input by flatpickr I'm using jquery in my project and I'm using flatpickr to place a date dropdown box. I nee...
From 2023-09-17 15:41:09
0
1
337
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！