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 省市区级联的更多相关文章

  1. bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  2. js省市区级联选择联动

    <!DOCTYPE html> <html lang="zh-cn"> <head> <meta http-equiv="Con ...

  3. angularJs实现级联操作

    angular实现级联非常的方便比起传统的jq和js来说,一般我们肯定是从后台获取一个list,然后生成一个下拉框,然后选中一个下拉框,得到id,再得到下一个list. 这些angular都给我做好了 ...

  4. 完全使用ASP.NET实现的省市区级联效果

    本功能特点:下级的显示和数据的加载都是由上一级下拉框的SelectedIndexChanged触发的,在上级下拉框没有选择之前,下级不会出现,用户体验比较好.无刷新方面,采用AJAX技术,在数据选择的 ...

  5. angularjs之级联菜单

    原理: 1.ng-options中val.id as val.name for val in cascading 将id的值赋给 mg-modelone2.在通过ng-change传给函数3.当一级下 ...

  6. java 爬取 国税局 省市区级联关系

    爬取网址 http://www.stats.gov.cn/tjsj/tjbz/tjyqhdmhcxhfdm/2018/index.html 因为数据比较大,存储为一个json,会内存溢出. 所以按照每 ...

  7. Element UI 中国省市区级联数据

    https://www.npmjs.com/package/element-china-area-data

  8. 一些关于angularJS的自己学习和开发过程中遇到的问题及解决办法

    这篇文章也许会不定时更新,主要记录这段时间内自己遇到的angularjs学习开发的一些问题的解决办法.本文以摘抄为主,主要目的还是将自己遇到的困惑在各个地方查到的解决办法的汇总,给自己留个备忘吧. 1 ...

  9. easyui combobox级联(转载)

    一.创建combobox 有如下几种方式可以创建一个combobox 1.使用select标签,并加上class="easyui-combobox",这种方式比较适用于静态的选项. ...

随机推荐

  1. 严重性 代码 说明 项目 文件 行 禁止显示状态错误 C1128 节数超过对象文件格式限制: 请使用 /bigobj 进行编译。

    严重性 代码 说明 项目 文件 行 禁止显示状态错误 C1128 节数超过对象文件格式限制: 请使用 /bigobj 进行编译. 默认情况下,对象文件最多可存放 65,536 (2^16) 个可寻址的 ...

  2. spring整合atomikos实现分布式事务

    前言 Atomikos 是一个为Java平台提供增值服务的并且开源类事务管理器,主要用于处理跨数据库事务,比如某个指令在A库和B库都有写操作,业务上要求A库和B库的写操作要具有原子性,这时候就可以用到 ...

  3. Python中列表,元组,字典,集合的区别

    参考文档https://blog.csdn.net/Yeoman92/article/details/56289287 理解Python中列表,元组,字典,集合的区别 列表,元组,字典,集合的区别是p ...

  4. 【ARTS】01_30_左耳听风-201900603~201900609

    ARTS: Algrothm: leetcode算法题目 Review: 阅读并且点评一篇英文技术文章 Tip/Techni: 学习一个技术技巧 Share: 分享一篇有观点和思考的技术文章 Algo ...

  5. 图像Resize中0.5像素中心对齐的问题

    目录 0.5像素对齐的问题 0.5像素对齐的问题 1. 问题提出 在进行图像缩放时,偶尔会看到一些比较奇怪的代码,其中有一个就是0.5像素中心对齐的问题,例如在OpenCV线性插值的代码中有类似如下操 ...

  6. 最新 草花互动java校招面经(含整理过的面试题大全)

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.草花互动等10家互联网公司的校招Offer,因为某些自身原因最终选择了草花互动.6.7月主要是做系统复习.项目复盘.Leet ...

  7. 最新 好未来java校招面经 (含整理过的面试题大全)

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿. 好未来等10家互联网公司的校招Offer,因为某些自身原因最终选择了 好未来.6.7月主要是做系统复习.项目复盘.Leet ...

  8. Mariadb/Mysql命令行常用命令

    一.初始化等 1.登陆数据库方法    mysql -u 用户名 -p 用户密码 2.修改root及用户密码 use mysql; update user set password=password( ...

  9. 在React native 如何写if判断和for循环

    在vue中一般在需要判断时都是通过if语句来实现的,但是在react native中一般则通过三元运算法来实现. 具体代码如下所示. import React from 'react'; import ...

  10. python 列表推导式 - python基础入门(16)

    截止到目前为止,python基础内容已经学习了50%左右,在学习编程过程中,我们不仅要学习python语法,同时也需要学习如何把自己代码写的更美观,效率更高. 一.什么是推导式 推导式是从一个或者多个 ...