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",这种方式比较适用于静态的选项. ...
随机推荐
- Centos7 安装svn步骤(宝塔面板)
1.运行以下命令安装SVN yum install subversion 2.运行以下命令创建目录 mkdir /var/svn 3.依次运行以下命令创建版本库 cd /var/svn svnad ...
- 【Oracle/Java】多表插删数据单多线程比较
源码下载:https://files.cnblogs.com/files/xiandedanteng/OracleAccessComparison20191117.rar 做这个比较工程初衷是:我在单 ...
- 治理Go模块 服务治理 中台业务 Golang的net.Conn接口,double close
小结: 1.中台业务 前台业务 快车.专车.顺风车,在滴滴这些业务线叫做前台服务,他们有一些共同的特性,都有司机信息,订单的状态,收银,账号等等这些业务逻辑,我们会把专门的业务逻辑集合起来,形成专职的 ...
- dom 加载监听事件 及解析
document.addEventListener("DOMContentLoaded", function (_event) { console.log("初始DOM ...
- html,body设置{height:100%}[转]
一般情况下,我们css控制的最高节点就是body,例如设置: body{background:#069;} 则浏览器界面就是完全的#068的背景色.这里看上去是<body>标签下的背景色起 ...
- Javascript-基本类型
数字 JavaScript不区分整数和浮点数,所有数字都用浮点数表示. 能够表示最大值是 -253 ~ 253,包含边界.超过范围的数无法保证低位数字的精度. JavaScript能直接识别十进制的整 ...
- osg model
osg::ref_ptr<osg::Node> MyOSGLoadEarth::CreateNode() { osg::ref_ptr<osg::Group> _root = ...
- spark 入门学习 核心api
spark入门教程(3)--Spark 核心API开发 原创 2016年04月13日 20:52:28 标签: spark / 分布式 / 大数据 / 教程 / 应用 4999 本教程源于2016年3 ...
- $().attr() 和 $().css的区别
使用jquery的.attr( )方法去给div隐藏,这样写的 $("#div_id").attr("display","none"),发现 ...
- Azure Web应用相关设置
这里用来记录自己在工作中,在Azure Web应用中用到的配置 设置NodeJS版本 Azure Web应用默认的NodeJS版本是0.10.4,这个版本太低,不能满足实际的需要 参照下图修改,根据自 ...