angularjs select
<html>
<head>
<meta charset="utf-8">
<title>select 測試頁面</title>
<script src="angular1.5.8.min.js"></script>
</head>
<body ng-app="app">
<div ng-controller="getnames">
<p>with ng-option,這種方式能夠取到一個對象</p>
<select ng-model="selectedPeople" ng-options="people.name for people in peoples"></select>
your choice is :{{selectedPeople.name}}
<!-------------------------------------------------------------------------------------------->
<p>without ng-option,這種方式只能取到一個字符串</p>
<select ng-model="selectedName">
<option ng-repeat="people in peoples" value="{{people.age}}">{{people.name}}</option>
</select>
your choice is :{{selectedName}}
</div>
</body>
<script type="text/javascript">
var app =angular.module("app",[]);
app.controller("getnames",function($scope){
$scope.peoples=[{name:"quannan",age:"100"},{name:"shenzhen",age:"1200"},{name:"shnaghai",age:"1003"}];
//$scope.names=["quannan","shenzhen","shanghai"];
});
</script>
</html>
相關文章
- 1. bootstrap-select插件angularjs爬坑
- 2. AngularJS下拉選擇框（select）
- 3. [Angularjs]ng-select和ng-options
- 4. angularjs select 默認選中option
- 5. angularjs select 三級聯動
- 6. AngularJS select詳細用法
- 7. AngularJS的select設置默認值
- 8. AngularJS之動態生成select下拉框
- 9. AngularJS select中ngOptions用法詳解
- 10. Angularjs Select獲取數組下標
- 更多相關文章...
- • ionic select - ionic 教程
- • SQLite Select 語句 - SQLite教程
- • 漫談MySQL的鎖機制
- • 三篇文章瞭解 TiDB 技術內幕 —— 說計算
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
相關文章