angularJS 无法进行if-else 判断的替代思路-CSDN博客

本文链接：https://blog.csdn.net/m0_37366775/article/details/75169615

在处理一个需求时，需要根据选中的仓库类型动态调整库区类型显示。起初尝试使用AngularJS的`ng-if`指令，但遇到问题。通过搜索找到使用JavaScript和`ng-model`结合的方法。具体实现是利用`ng-change`事件，但在js更新input值时，`ng-change`未触发。最后，通过`ng-focus`事件在库区类型选择上定义函数，成功实现了根据仓库类型显示相应库区的效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

周六来加班，给我了一个新需求，要从仓库的下拉表中，选中一个仓库名称，取出该仓库的仓库类型，然后需要根据不同的类型动态改变库区的类型。

首先想到的是<div ng-if="">,但是发现这种写法行不通。

因为前端直接忽略了<div ng-if="">判断，显示出了所有的库区类型下拉框。

后来百度，见有人使用js+ng-model可以实现；就试了一下

首先添加一个input，把拿到的仓库状态值放到input中；意识到下拉表会直接改变input的值所以定义了一个 ng-change函数；

后来发现，当js传给input值时，ng-change事件并不触发；

最终采用ng-focus事件：在库区类型上定义；

$scope.getZoneTypeInput = function(){
debugger;
var zoneType=$scope.zoneTypeInput;
if(zoneType=='大件' || zoneType=="大件仓"){
$('.large').show();
$('.little').hide();
$('.micro').hide();
$('.middle').hide();
}else if(zoneType=='小件' || zoneType=="小件仓"){
$('.large').hide();
$('.little').show();
$('.micro').hide();
$('.middle').hide();
}else if(zoneType=='微仓'){
$('.large').hide();
$('.little').hide();
$('.micro').show();
$('.middle').hide();
}else if(zoneType=='中件仓' || zoneType=='中件'){
$('.large').hide();
$('.little').hide();
$('.micro').hide();
$('.middle').show();
}
}