ng-select 下拉的两种方式
Posted 关关大大
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ng-select 下拉的两种方式相关的知识,希望对你有一定的参考价值。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<div ng-app="myapp" ng-controller="myctrl">
<select ng-model="data" >
<option value="">选择地址</option>
<option ng-repeat="x in name">{{x}}</option>
</select>
</div>
<div ng-app="app1" ng-controller="myctrl1" id="a">
<select ng-options="x for x in name" ng-model="name">//必须添加ng-model
<option value=""></option>
</select>
<select ng-model="p" ng-options="x.id as x.name for x in gg"></select>//便利数组对象
{{p}}//输出对象的ID
<select ng-model="a" ng-options="x.id as x.name group by x.key for x in gs"></select>//便利jeson并分组
</div>
</body>
<script src="js/angurlar素材/angular/angular.js"></script>
<script>
var app =angular.module("myapp",[]).controller("myctrl",function($scope){
$scope.name=["关关","xsss","sss"]
});//运用ng-repeat完成项目
var a=document.querySelector("#a");
console.log(a)
angular.module("app1",[]).controller("myctrl1",function($scope){
$scope.name=["关关","x","sss"]//定义数组
$scope.gg=[{id:1,name:"guanguan"}
{id:2,name:"kankang"}
]
$scope.gs=[
{id:1,name:"关关",key:"我的好友"},
{id:2,name:"中中",key:"我的好友"},
{id:3,name:"亮亮",key:"我的好友"},
{id:4,name:"小小",key:"黑名单"},
]
});//运用ng-options完成
angular.bootstrap(a,["app1"])//运用bootstrop完成多个模块加载
</script>
</html>
以上是关于ng-select 下拉的两种方式的主要内容,如果未能解决你的问题,请参考以下文章
Select2 for AngularJS 中的两种方式数据绑定不起作用
[微信小程序] 微信小程序下拉滚动选择器picker绑定数据的两种方式
Angular2 切换/打开 ng2-select 下拉菜单