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. JavaScript原型,原型链 ? 有什么特点?

    每个对象都会在其内部初始化一个属性,就是prototype(原型),当我们访问一个对象的属性时, 如果这个对象内部不存在这个属性,那么他就会去prototype里找这个属性,这个prototype又会 ...

  2. MySQL格式化时间date_format

    select date_format(deal_date, '%Y年%m月%d日 %H时%i分%s秒'), date_format(deal_date, '%Y-%m-%d %H:%i:%s') fr ...

  3. [转][C#]dll 引用

    本文转自:https://zhidao.baidu.com/question/1176198151354174139.html 首先,对应关系: C++ C#===================== ...

  4. sql注入攻击的预防函数-如何防御sql注入

    1.预编译 2.捆绑变量各种过滤 用到的函数: addslashes  htmlspecialchars  mysql_escape_string($string) mysql_real_escape ...

  5. Javescript——变量声明的区别

    原文链接:ES6 Syntax and Feature Overview View on GitHub Keyword Scope Hoisting Can Be Reassigned Can Be ...

  6. [LeetCode] 167. Fraction to Recurring Decimal 分数转循环小数

    Given two integers representing the numerator and denominator of a fraction, return the fraction in ...

  7. Zabbix之设置监控主机某个端口并发送邮件告警

    Zabbix可以配置监控主机的某个端口在该端口down之后触发发送告警邮件 一,添加监控项 选择主机 监控项 创建监控项 查看监控图形 二,设置触发器 设置触发器当该监控的端口down时可以发送告警 ...

  8. 利用PHP应用程序中的远程文件包含(RFI)并绕过远程URL包含限制

    来源:http://www.mannulinux.org/2019/05/exploiting-rfi-in-php-bypass-remote-url-inclusion-restriction.h ...

  9. 移动App书写Test Case时需要考虑的检查点

    在测试工作中我们需要不断的总结和储备自己的知识和经验,譬如具备特定属性.环境以及场景,如:PC,手机,智能设备,特定网络环境下. 我们需要关注的功能点,容易出错的位置,这将对我们整个测试过程起至关作用 ...

  10. 使用说明(2S)

    [Build Status] 功能 系统代理设置 PAC 模式和全局模式 [GFWList] 和用户规则 支持 HTTP 代理 支持多服务器切换 支持 UDP 代理 支持插件 下载 下载 [最新版]. ...