angular 实现自定义样式下拉菜单

自己闲着没事写了一个自定义的下拉菜单希望和大家交流一下!望能和大神们成为朋友。

下面上代码:

<!doctype html>

<html lang="en" ng-app='App'>

<head>

<meta charset="UTF-8">

<title>Document</title>

<script src='../angular-1.3.9/angular.js'></script>

<style>

*{

list-style:none;

margin: 0;

padding: 0;

-webkit-box-sizing: border-box;

}

.listbox{

width: 200px;

margin: 0 auto;

border: 1px solid #333;

height: auto;

}

.listbox ul{

width: 100%;

height: auto;

border-bottom:1px solid #ccc;

box-shadow: 2px 2px 3px #000;

}

.listbox ul p{

width: 100%;

height: 32px;

line-height: 30px;

color: #333;

border-bottom: 1px solid #333;

text-indent: 10px;

}

.listbox ul li{

width: 100%;

height: 30px;

line-height: 30px;

border-bottom: 1px solid #ccc;

text-indent: 10px;

}

</style>

</head>

<body ng-controller='modulecont'>

<div class='listbox'>

<ul>

<p ng-click='toggle($event,$index)' data-id='{{cityId}}'>{{title}}</p>

<li ng-repeat='i in list' ng-show='aa' ng-click='toggle($event,$index)'>{{i.name}}</li>

</ul>

</div>

<script>

var datasrc = {

"localArea":[{"name":"朝阳","id":1142,"paramname":"localDiduan","option":[{"name":"国贸","id":1195,"pid":1142},{"name":"CBD ","id":6834,"pid":1142},{"name":"大望路","id":5785,"pid":1142},{"name":"四惠","id":5786,"pid":1142},{"name":"双井","id":5779,"pid":1142},{"name":"劲松","id":1199,"pid":1142},{"name":"潘家园","id":5780,"pid":1142},{"name":"广渠门","id":5990,"pid":1142},{"name":"建外大街","id":5988,"pid":1142},{"name":"东大桥","id":6830,"pid":1142},{"name":"工体","id":5826,"pid":1142},{"name":"朝外大街","id":6017,"pid":1142},{"name":"京广桥","id":1202,"pid":1142},{"name":"团结湖","id":7559,"pid":1142},{"name":"朝阳公园","id":5999,"pid":1142},{"name":"呼家楼","id":1207,"pid":1142},{"name":"三里屯","id":1198,"pid":1142},{"name":"麦子店","id":6001,"pid":1142},{"name":"燕莎","id":1200,"pid":1142},{"name":"三元桥","id":1194,"pid":1142},{"name":"国展","id":7560,"pid":1142},{"name":"西坝河","id":7561,"pid":1142},{"name":"柳芳","id":7566,"pid":1142},{"name":"和平街","id":5784,"pid":1142},{"name":"左家庄","id":7564,"pid":1142},{"name":"太阳宫","id":6014,"pid":1142},{"name":"芍药居","id":7550,"pid":1142},{"name":"安贞","id":1204,"pid":1142},{"name":"亚运村","id":1193,"pid":1142},{"name":"安慧桥","id":5992,"pid":1142},{"name":"小关","id":7563,"pid":1142},{"name":"北沙滩","id":7565,"pid":1142},{"name":"奥运村","id":5994,"pid":1142},{"name":"大屯","id":5993,"pid":1142},{"name":"亚运村小营","id":6828,"pid":1142},{"name":"望京","id":1203,"pid":1142},{"name":"来广营","id":6012,"pid":1142},{"name":"媒体村","id":12211,"pid":1142},{"name":"花家地","id":6019,"pid":1142},{"name":"北苑","id":5782,"pid":1142},{"name":"大山子","id":7551,"pid":1142},{"name":"酒仙桥","id":1206,"pid":1142},{"name":"甘露园","id":12179,"pid":1142},{"name":"首都机场","id":6002,"pid":1142},{"name":"东坝","id":6011,"pid":1142},{"name":"姚家园","id":6010,"pid":1142},{"name":"水碓子","id":6021,"pid":1142},{"name":"甜水园","id":6832,"pid":1142},{"name":"朝青板块","id":6833,"pid":1142},{"name":"石佛营","id":6006,"pid":1142},{"name":"十里堡","id":5997,"pid":1142},{"name":"红庙","id":6018,"pid":1142},{"name":"百子湾","id":7558,"pid":1142},{"name":"高碑店","id":6940,"pid":1142},{"name":"定福庄","id":6835,"pid":1142},{"name":"双桥","id":11367,"pid":1142},{"name":"慈云寺","id":12197,"pid":1142},{"name":"常营","id":6009,"pid":1142},{"name":"管庄","id":5781,"pid":1142},{"name":"南磨房","id":6005,"pid":1142},{"name":"垡头","id":5998,"pid":1142},{"name":"豆各庄","id":6004,"pid":1142},{"name":"十八里店","id":6003,"pid":1142},{"name":"小红门","id":6838,"pid":1142},{"name":"十里河","id":12945,"pid":1142},{"name":"惠新西街","id":13695,"pid":1142},{"name":"将台路","id":7562,"pid":1142},{"name":"八里庄","id":14036,"pid":1142},{"name":"欢乐谷","id":14068,"pid":1142},{"name":"惠新里","id":14576,"pid":1142},{"name":"南沙滩","id":18328,"pid":1142},{"name":"农业展览馆","id":18766,"pid":1142},{"name":"胜古","id":16081,"pid":1142},{"name":"朝阳周边","id":1208,"pid":1142},{"name":"健翔桥","id":15334,"pid":1142},{"name":"松榆里","id":15335,"pid":1142},{"name":"孙河","id":15336,"pid":1142},{"name":"华威桥","id":15377,"pid":1142}]},{"name":"海淀","id":1143,"paramname":"localDiduan","option":[{"name":"中关村","id":1196,"pid":1143},{"name":"北京大学","id":1236,"pid":1143},{"name":"清华大学","id":1237,"pid":1143},{"name":"五道口","id":5788,"pid":1143},{"name":"上地","id":1238,"pid":1143},{"name":"西三旗","id":5790,"pid":1143},{"name":"西二旗","id":11365,"pid":1143},{"name":"清河","id":5791,"pid":1143},{"name":"二里庄","id":6817,"pid":1143},{"name":"学院路","id":1241,"pid":1143},{"name":"知春路","id":5789,"pid":1143},{"name":"牡丹园","id":6819,"pid":1143},{"name":"小西天","id":6851,"pid":1143},{"name":"北航","id":7554,"pid":1143},{"name":"北太平庄","id":5792,"pid":1143},{"name":"蓟门桥","id":5985,"pid":1143},{"name":"双榆树","id":5967,"pid":1143},{"name":"人民大学","id":6714,"pid":1143},{"name":"皂君庙","id":7552,"pid":1143},{"name":"大钟寺","id":5981,"pid":1143},{"name":"魏公村","id":1239,"pid":1143},{"name":"交通大学","id":12196,"pid":1143},{"name":"白石桥","id":7556,"pid":1143},{"name":"紫竹桥","id":1243,"pid":1143},{"name":"花园桥","id":5977,"pid":1143},{"name":"北洼路","id":7433,"pid":1143},{"name":"航天桥","id":5975,"pid":1143},{"name":"甘家口","id":1246,"pid":1143},{"name":"军博","id":6822,"pid":1143},{"name":"公主坟","id":1245,"pid":1143},{"name":"厂洼","id":15172,"pid":1143},{"name":"玉泉路","id":15592,"pid":1143},{"name":"万寿路","id":6716,"pid":1143},{"name":"五棵松","id":5979,"pid":1143},{"name":"永定路","id":5970,"pid":1143},{"name":"西八里庄","id":1244,"pid":1143},{"name":"定慧寺","id":7555,"pid":1143},{"name":"田村","id":5969,"pid":1143},{"name":"四季青","id":6717,"pid":1143},{"name":"香山","id":6715,"pid":1143},{"name":"世纪城","id":5982,"pid":1143},{"name":"苏州桥","id":5983,"pid":1143},{"name":"苏州街","id":6818,"pid":1143},{"name":"万泉河","id":5974,"pid":1143},{"name":"增光路","id":12195,"pid":1143},{"name":"万柳","id":7553,"pid":1143},{"name":"西苑","id":6924,"pid":1143},{"name":"马连洼","id":5968,"pid":1143},{"name":"西北旺","id":5787,"pid":1143},{"name":"车道沟","id":14573,"pid":1143},{"name":"西山","id":14574,"pid":1143},{"name":"万寿寺","id":14575,"pid":1143},{"name":"明光桥","id":14756,"pid":1143},{"name":"安宁庄","id":14892,"pid":1143},{"name":"学院路北","id":16082,"pid":1143},{"name":"温泉","id":18168,"pid":1143},{"name":"肖家河","id":15895,"pid":1143},{"name":"五彩城","id":18330,"pid":1143},{"name":"海淀周边","id":1247,"pid":1143},{"name":"金沟河","id":15331,"pid":1143},{"name":"恩济里","id":15332,"pid":1143},{"name":"五路居","id":15333,"pid":1143},{"name":"联想桥","id":15376,"pid":1143}]},{"name":"东城","id":1138,"paramname":"localDiduan","option":[{"name":"东直门","id":1156,"pid":1138},{"name":"东直门外","id":5823,"pid":1138},{"name":"和平里","id":1159,"pid":1138},{"name":"雍和宫","id":5816,"pid":1138},{"name":"安定门","id":5817,"pid":1138},{"name":"交道口","id":5819,"pid":1138},{"name":"东四十条","id":5820,"pid":1138},{"name":"海运仓","id":6847,"pid":1138},{"name":"北新桥","id":5818,"pid":1138},{"name":"朝阳门","id":1158,"pid":1138},{"name":"建国门","id":5821,"pid":1138},{"name":"北京站","id":5822,"pid":1138},{"name":"王府井","id":1160,"pid":1138},{"name":"景山","id":1157,"pid":1138},{"name":"灯市口","id":6849,"pid":1138},{"name":"沙滩 ","id":6848,"pid":1138},{"name":"东单","id":5825,"pid":1138},{"name":"东四","id":5824,"pid":1138},{"name":"东城周边","id":1161,"pid":1138}]},{"name":"西城","id":1139,"paramname":"localDiduan","option":[{"name":"西直门","id":1174,"pid":1139},{"name":"车公庄","id":5804,"pid":1139},{"name":"官园","id":7568,"pid":1139},{"name":"百万庄","id":6852,"pid":1139},{"name":"阜成门","id":5795,"pid":1139},{"name":"西四","id":5797,"pid":1139},{"name":"展览路","id":5796,"pid":1139},{"name":"月坛","id":1172,"pid":1139},{"name":"金融街","id":6040,"pid":1139},{"name":"西单","id":1173,"pid":1139},{"name":"德胜门","id":5801,"pid":1139},{"name":"六铺炕","id":6044,"pid":1139},{"name":"积水潭","id":5805,"pid":1139},{"name":"新街口","id":5798,"pid":1139},{"name":"马甸","id":5803,"pid":1139},{"name":"鼓楼","id":1175,"pid":1139},{"name":"地安门","id":5799,"pid":1139},{"name":"复兴门","id":6041,"pid":1139},{"name":"西便门","id":5794,"pid":1139},{"name":"南礼士路","id":1171,"pid":1139},{"name":"什刹海","id":5800,"pid":1139},{"name":"木樨地","id":6042,"pid":1139},{"name":"三里河","id":6043,"pid":1139},{"name":"真武庙","id":15170,"pid":1139},{"name":"西城周边","id":1177,"pid":1139}]},{"name":"崇文","id":1140,"paramname":"localDiduan","option":[{"name":"崇文门","id":1180,"pid":1140},{"name":"前门","id":1178,"pid":1140},{"name":"新世界","id":6063,"pid":1140},{"name":"广渠门","id":6062,"pid":1140},{"name":"东花市","id":1182,"pid":1140},{"name":"法华寺","id":6853,"pid":1140},{"name":"体育馆路","id":1183,"pid":1140},{"name":"磁器口","id":6064,"pid":1140},{"name":"天坛","id":1179,"pid":1140},{"name":"永定门","id":1184,"pid":1140},{"name":"龙潭湖","id":1181,"pid":1140},{"name":"光明楼","id":6061,"pid":1140},{"name":"崇文周边","id":1185,"pid":1140}]},{"name":"宣武","id":1141,"paramname":"localDiduan","option":[{"name":"广安门外","id":6858,"pid":1141},{"name":"广安门内","id":6857,"pid":1141},{"name":"天宁寺","id":6060,"pid":1141},{"name":"马连道","id":5842,"pid":1141},{"name":"红莲","id":6854,"pid":1141},{"name":"白纸坊","id":5835,"pid":1141},{"name":"南菜园","id":6855,"pid":1141},{"name":"大观园","id":5148,"pid":1141},{"name":"白广路","id":5147,"pid":1141},{"name":"牛街","id":1162,"pid":1141},{"name":"长椿街","id":5839,"pid":1141},{"name":"宣武门","id":5151,"pid":1141},{"name":"椿树街道","id":6856,"pid":1141},{"name":"菜市口","id":5149,"pid":1141},{"name":"陶然亭","id":1163,"pid":1141},{"name":"珠市口","id":5838,"pid":1141},{"name":"虎坊桥","id":5150,"pid":1141},{"name":"天桥","id":5837,"pid":1141},{"name":"大栅栏","id":5841,"pid":1141},{"name":"和平门","id":5836,"pid":1141},{"name":"宣武周边","id":1164,"pid":1141}]},{"name":"丰台","id":1144,"paramname":"localDiduan","option":[{"name":"西客站","id":6024,"pid":1144},{"name":"太平桥","id":5130,"pid":1144},{"name":"六里桥","id":6022,"pid":1144},{"name":"丰台路","id":5128,"pid":1144},{"name":"青塔","id":6035,"pid":1144},{"name":"岳各庄","id":6034,"pid":1144},{"name":"卢沟桥","id":5129,"pid":1144},{"name":"长辛店","id":5131,"pid":1144},{"name":"云岗","id":7567,"pid":1144},{"name":"北大地","id":6030,"pid":1144},{"name":"丰台体育馆","id":6039,"pid":1144},{"name":"丽泽桥","id":6037,"pid":1144},{"name":"科技园区","id":6031,"pid":1144},{"name":"世界公园","id":6861,"pid":1144},{"name":"新宫","id":13579,"pid":1144},{"name":"花乡","id":6038,"pid":1144},{"name":"玉泉营","id":1212,"pid":1144},{"name":"菜户营","id":6028,"pid":1144},{"name":"西罗园","id":5136,"pid":1144},{"name":"右安门","id":5134,"pid":1144},{"name":"草桥","id":6032,"pid":1144},{"name":"洋桥","id":6023,"pid":1144},{"name":"木樨园","id":6025,"pid":1144},{"name":"新发地","id":11380,"pid":1144},{"name":"赵公口","id":6026,"pid":1144},{"name":"嘉园","id":7437,"pid":1144},{"name":"刘家窑","id":6027,"pid":1144},{"name":"蒲黄榆","id":6036,"pid":1144},{"name":"左安门","id":6033,"pid":1144},{"name":"方庄","id":1213,"pid":1144},{"name":"东铁匠营","id":5140,"pid":1144},{"name":"丰益桥","id":15171,"pid":1144},{"name":"看丹桥","id":15548,"pid":1144},{"name":"成寿寺","id":6029,"pid":1144},{"name":"宋家庄","id":6859,"pid":1144},{"name":"大红门","id":5137,"pid":1144},{"name":"七里庄","id":11821,"pid":1144},{"name":"马家堡","id":5135,"pid":1144},{"name":"五里店","id":11820,"pid":1144},{"name":"角门","id":6860,"pid":1144},{"name":"南苑","id":9046,"pid":1144},{"name":"东高地","id":5139,"pid":1144},{"name":"和义","id":11454,"pid":1144},{"name":"莲花池","id":13434,"pid":1144},{"name":"丰台周边","id":5141,"pid":1144},{"name":"总部基地","id":15551,"pid":1144}]},{"name":"通州","id":1147,"paramname":"localDiduan","option":[{"name":"北关","id":5811,"pid":1147},{"name":"北关环岛","id":6899,"pid":1147},{"name":"永顺","id":5145,"pid":1147},{"name":"新华大街","id":2639,"pid":1147},{"name":"通州北苑","id":5142,"pid":1147},{"name":"八里桥","id":6056,"pid":1147},{"name":"果园","id":5808,"pid":1147},{"name":"九棵树","id":5809,"pid":1147},{"name":"梨园","id":5144,"pid":1147},{"name":"土桥","id":5810,"pid":1147},{"name":"临河里","id":6055,"pid":1147},{"name":"中仓","id":6047,"pid":1147},{"name":"西门","id":5806,"pid":1147},{"name":"乔庄","id":6057,"pid":1147},{"name":"东关","id":7569,"pid":1147},{"name":"运河大街","id":7439,"pid":1147},{"name":"玉桥","id":5807,"pid":1147},{"name":"张家湾","id":6049,"pid":1147},{"name":"八通轻轨沿线","id":2638,"pid":1147},{"name":"武夷花园","id":6900,"pid":1147},{"name":"潞城","id":7438,"pid":1147},{"name":"马驹桥","id":6051,"pid":1147},{"name":"漷县","id":12210,"pid":1147},{"name":"次渠","id":14583,"pid":1147},{"name":"永乐店","id":18254,"pid":1147},{"name":"通州周边","id":5146,"pid":1147}]},{"name":"石景山","id":1145,"paramname":"localDiduan","option":[{"name":"八宝山","id":1228,"pid":1145},{"name":"玉泉路","id":6865,"pid":1145},{"name":"鲁谷","id":6065,"pid":1145},{"name":"永乐","id":6069,"pid":1145},{"name":"衙门口","id":6864,"pid":1145},{"name":"八角","id":5843,"pid":1145},{"name":"老山","id":6945,"pid":1145},{"name":"杨庄 ","id":6863,"pid":1145},{"name":"古城","id":1229,"pid":1145},{"name":"苹果园","id":1230,"pid":1145},{"name":"金顶街","id":6066,"pid":1145},{"name":"模式口","id":6862,"pid":1145},{"name":"五里坨","id":6068,"pid":1145},{"name":"西山","id":6944,"pid":1145},{"name":"八大处","id":6070,"pid":1145},{"name":"广宁","id":14577,"pid":1145},{"name":"石景山周边","id":1231,"pid":1145}]},{"name":"房山","id":6808,"paramname":"localDiduan","option":[{"name":"长阳","id":6906,"pid":6808},{"name":"良乡","id":6866,"pid":6808},{"name":"阎村","id":7440,"pid":6808},{"name":"迎风","id":6946,"pid":6808},{"name":"窦店","id":6867,"pid":6808},{"name":"房山城关","id":11373,"pid":6808},{"name":"琉璃河","id":12178,"pid":6808},{"name":"韩村河","id":7441,"pid":6808},{"name":"燕山","id":12177,"pid":6808},{"name":"周口店","id":14757,"pid":6808},{"name":"房山周边","id":6869,"pid":6808}]},{"name":"昌平","id":1150,"paramname":"localDiduan","option":[{"name":"天通苑","id":2641,"pid":1150},{"name":"立水桥","id":5834,"pid":1150},{"name":"东小口","id":6059,"pid":1150},{"name":"霍营","id":5828,"pid":1150},{"name":"小汤山","id":5827,"pid":1150},{"name":"北七家","id":5833,"pid":1150},{"name":"回龙观","id":2640,"pid":1150},{"name":"龙泽","id":6898,"pid":1150},{"name":"城北","id":5829,"pid":1150},{"name":"沙河","id":5153,"pid":1150},{"name":"百善","id":5832,"pid":1150},{"name":"阳坊","id":6058,"pid":1150},{"name":"南口","id":5152,"pid":1150},{"name":"城南","id":5830,"pid":1150},{"name":"昌平县城","id":7425,"pid":1150},{"name":"南邵镇","id":15540,"pid":1150},{"name":"昌平周边","id":5154,"pid":1150}]},{"name":"大兴","id":6809,"paramname":"localDiduan","option":[{"name":"亦庄","id":6872,"pid":6809},{"name":"旧宫 ","id":6871,"pid":6809},{"name":"郁花园","id":7480,"pid":6809},{"name":"同兴园","id":6878,"pid":6809},{"name":"西红门","id":6870,"pid":6809},{"name":"兴华大街","id":6873,"pid":6809},{"name":"清源","id":7431,"pid":6809},{"name":"兴丰大街","id":6874,"pid":6809},{"name":"海子角","id":6877,"pid":6809},{"name":"黄村","id":7570,"pid":6809},{"name":"兴业大街","id":6948,"pid":6809},{"name":"观音寺","id":6876,"pid":6809},{"name":"滨河","id":6875,"pid":6809},{"name":"林校路","id":7426,"pid":6809},{"name":"枣园","id":18329,"pid":6809},{"name":"庞各庄","id":14578,"pid":6809},{"name":"生物医药基地","id":18828,"pid":6809},{"name":"瀛海镇","id":16013,"pid":6809},{"name":"高米店","id":16124,"pid":6809},{"name":"大兴周边","id":6881,"pid":6809}]},{"name":"顺义","id":6810,"paramname":"localDiduan","option":[{"name":"胜利","id":7571,"pid":6810},{"name":"石园","id":6884,"pid":6810},{"name":"天竺","id":6885,"pid":6810},{"name":"新国展","id":6887,"pid":6810},{"name":"机场","id":7572,"pid":6810},{"name":"南彩","id":6888,"pid":6810},{"name":"马坡","id":7432,"pid":6810},{"name":"后沙峪","id":6882,"pid":6810},{"name":"李桥","id":6886,"pid":6810},{"name":"光明 ","id":6883,"pid":6810},{"name":"裕龙","id":12180,"pid":6810},{"name":"建新","id":12181,"pid":6810},{"name":"杨镇","id":11452,"pid":6810},{"name":"顺义城区","id":11353,"pid":6810},{"name":"*别墅区","id":12182,"pid":6810},{"name":"顺义周边","id":6889,"pid":6810}]},{"name":"密云","id":6811,"paramname":"localDiduan","option":[{"name":"密云城区","id":6913,"pid":6811},{"name":"不老屯","id":6907,"pid":6811},{"name":"溪翁庄","id":6908,"pid":6811},{"name":"密云周边","id":6891,"pid":6811}]},{"name":"怀柔","id":6812,"paramname":"localDiduan","option":[{"name":"雁栖","id":6909,"pid":6812},{"name":"桥梓","id":6912,"pid":6812},{"name":"怀柔城区","id":6910,"pid":6812},{"name":"渤海镇","id":6911,"pid":6812},{"name":"庙城","id":14579,"pid":6812},{"name":"怀柔周边","id":6892,"pid":6812}]},{"name":"延庆","id":6813,"paramname":"localDiduan","option":[{"name":"延庆城区","id":6914,"pid":6813},{"name":"大榆树","id":6915,"pid":6813},{"name":"八达岭","id":7443,"pid":6813},{"name":"康庄","id":18255,"pid":6813},{"name":"延庆周边","id":6893,"pid":6813}]},{"name":"平谷","id":6814,"paramname":"localDiduan","option":[{"name":"金海湖","id":6916,"pid":6814},{"name":"滨河路","id":7445,"pid":6814},{"name":"平谷城区","id":6917,"pid":6814},{"name":"兴谷","id":14581,"pid":6814},{"name":"渔阳","id":14582,"pid":6814},{"name":"王辛庄","id":14580,"pid":6814},{"name":"平谷周边","id":6894,"pid":6814}]},{"name":"门头沟","id":6815,"paramname":"localDiduan","option":[{"name":"大峪","id":6895,"pid":6815},{"name":"东辛房","id":6918,"pid":6815},{"name":"龙泉","id":7444,"pid":6815},{"name":"城子街道 ","id":6896,"pid":6815},{"name":"永定","id":6919,"pid":6815},{"name":"潭柘寺","id":6922,"pid":6815},{"name":"军庄","id":6920,"pid":6815},{"name":"门头沟周边","id":6897,"pid":6815}]},{"name":"燕郊","id":11362,"paramname":"localDiduan","option":[{"name":"大厂","id":18371,"pid":11362},{"name":"潮白河","id":18370,"pid":11362},{"name":"东市区","id":18368,"pid":11362},{"name":"迎宾路","id":18367,"pid":11362},{"name":"城区","id":18369,"pid":11362},{"name":"燕顺路","id":18366,"pid":11362}]},{"name":"北京周边","id":1146,"paramname":"localDiduan","option":[{"name":"香河","id":11363,"pid":1146},{"name":"涿州","id":15759,"pid":1146},{"name":"三河","id":11364,"pid":1146},{"name":"永清","id":18765,"pid":1146},{"name":"固安","id":15008,"pid":1146}]}]

}

var App=angular.module('App',[])

App.controller('modulecont',function($scope){

$scope.list=datasrc.localArea;

$scope.title='请选择';

$scope.cityId='0';

$scope.aa = false;

$scope.toggle = function toggle(e,index) {

e.preventDefault();

if(index!==undefined){

$scope.title=datasrc.localArea[index].name;

$scope.cityId=datasrc.localArea[index].id;

}

$scope.aa = !$scope.aa;

}

})

</script>

</body>

</html>

由于数据是从真实项目中拿来的有点多,大家可以复制代码看看效果吧!欢迎大家相互交流!

上一篇:Python 云计算 Harbor 镜像仓库


下一篇:jqmobi 子菜单 高亮效果