Angularjs 省市区级联
Json 地区文件:http://blog.csdn.net/youshi520000/article/details/70808580

angularjs
angular.module('app')
.controller('inbillofladingCtrl', ['$scope', '$filter', '$location', 'alertify', 'transferService', 'pagerService','inbillofladingService',
function ($scope, $filter, $location, alertify, transferService, pagerService, inbillofladingService) {
$scope.chinaCities = CityAreaList;
//省份切换
$scope.changeProvince = function () {
var province = $scope.searcher.ShipAddressProvince;
if (!angular.equals("", province)) {
$scope.CityList = $scope.chinaCities.find(c => c.name === province).city;
} else {
$scope.CityList = null;
$scope.AreaList = null;
}
}
//城市切换
$scope.changeCity = function () {
var city = $scope.searcher.ShipAddressCity;
if (!angular.equals("", city)) {
$scope.AreaList = $scope.CityList.find(c=>c.name===city).area;
} else {
$scope.AreaList = null;
}
}
}]);
html
选择省:
<select ng-model="searcher.ShipAddressProvince" ng-change="changeProvince()">
<option value="">请选择</option>
<option ng-repeat="v in chinaCities" value="{{v.name}}">{{v.name}}</option>
</select>
选择市:
<select ng-model="searcher.ShipAddressCity" ng-change="changeCity()">
<option value="">请选择</option>
<option ng-repeat="v in CityList" value="{{v.name}}">{{v.name}}</option>
</select>
选择区:
<select ng-model="searcher.ShipAddressArea">
<option value="">请选择</option>
<option ng-repeat="v in AreaList" value="{{v}}">{{v}}</option>
</select>
Angularjs 省市区级联的更多相关文章
- bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- js省市区级联选择联动
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta http-equiv="Con ...
- angularJs实现级联操作
angular实现级联非常的方便比起传统的jq和js来说,一般我们肯定是从后台获取一个list,然后生成一个下拉框,然后选中一个下拉框,得到id,再得到下一个list. 这些angular都给我做好了 ...
- 完全使用ASP.NET实现的省市区级联效果
本功能特点:下级的显示和数据的加载都是由上一级下拉框的SelectedIndexChanged触发的,在上级下拉框没有选择之前,下级不会出现,用户体验比较好.无刷新方面,采用AJAX技术,在数据选择的 ...
- angularjs之级联菜单
原理: 1.ng-options中val.id as val.name for val in cascading 将id的值赋给 mg-modelone2.在通过ng-change传给函数3.当一级下 ...
- java 爬取 国税局 省市区级联关系
爬取网址 http://www.stats.gov.cn/tjsj/tjbz/tjyqhdmhcxhfdm/2018/index.html 因为数据比较大,存储为一个json,会内存溢出. 所以按照每 ...
- Element UI 中国省市区级联数据
https://www.npmjs.com/package/element-china-area-data
- 一些关于angularJS的自己学习和开发过程中遇到的问题及解决办法
这篇文章也许会不定时更新,主要记录这段时间内自己遇到的angularjs学习开发的一些问题的解决办法.本文以摘抄为主,主要目的还是将自己遇到的困惑在各个地方查到的解决办法的汇总,给自己留个备忘吧. 1 ...
- easyui combobox级联(转载)
一.创建combobox 有如下几种方式可以创建一个combobox 1.使用select标签,并加上class="easyui-combobox",这种方式比较适用于静态的选项. ...
随机推荐
- MAC常用快捷键 基本常用的都整理在这里了
写在前面Mac系统中有几个比较特殊的功能键,和Win系统的区别也主要在这里比如在Win系统中我们常用的Ctrl键,在Mac系统中对应的不是长得比较像的Cnotrol,而是Command键,貌似也是Ma ...
- 沙箱测试环境配置AND证书添加
支付宝SDK接口项目Demo测试 一.进入支付宝开放中心 下载密钥生成器 https://developers.alipay.com/developmentAccess/developmentAcce ...
- Div 居中对齐(水平、垂直)
一:水平居中对齐 *********************************************************************************** 示例图 代码 ...
- shell脚本安装python、pip--交互式的
首先把pip-.tgz 安装包放在 /usr/local 下面,按照顺序先安装pip,再安装python.不要先安装或只安装python,否则很容易出错, [root@bogon ~]# cat pi ...
- git 平时遇到的问题记录
1.git warning: LF will be replaced by CRLF in 解决办法 git config core.autocrlf false 2.git提交时如何忽略一些文件 h ...
- iOS——数据安全
在移动互联网快速发展的今天,iOS应用直接运行在用户的手机上,与运行在服务器后台服务相比,更有可能被黑客攻击. a.网络安全: 1.1 安全地传输用户密码 事先生成一对用于加密的公私钥,客户端登录的时 ...
- 🔥Scratch少儿编程——飞机大战
前两天用
- 【ARM-Linux开发】TI AM437x调试WEB CAM
Rico Board是基于TI AM437x的一款小型学习板,提供的丰富的接口以及资源,能够实现很多有趣的idea,从本周起,开始总共四期的实验教程,帮助玩家们快速上手Rico Board在嵌入式上面 ...
- DDS工作原理及其性能分析
DDS工作原理及其性能分析 声明:引用请注明出处http://blog.csdn.net/lg1259156776/ 系列博客说明:此系列博客属于作者在大三大四阶段所储备的关于电子电路设计等硬件方面的 ...
- 最新 哔哩哔哩java校招面经 (含整理过的面试题大全)
从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.哔哩哔哩等10家互联网公司的校招Offer,因为某些自身原因最终选择了哔哩哔哩.6.7月主要是做系统复习.项目复盘.Leet ...