Javascript 如何使用空值在angularjs中实现类似Excel的过滤器？

我是AngualarJS新手，我需要使用

angulajs（v.1）

实现类似Excel的表格过滤器。我搜索了这个网站，在这里找到了一个解决方案：

上面的解决方案很好，但是如果我的列表中有null或空值，那么它就不起作用

在这种情况下，

搜索文本

功能适用于列

状态

，因为它填充了所有值，但由于所有其他列都有空值，

搜索框

功能不起作用

请参阅上面的解决方案使用控制器中变量的数据，但我使用的是

后端（SpringBoot）

的数据，并将其用作列表

在这种情况下请帮助我

这是我的控制器类的代码段

var usecaseData = UseCaseOverview.get(function (){

        $scope.XLfilters = { list: [], dict: {}, results: [] };

        $scope.markAll = function(field, b) {
              $scope.XLfilters.dict[field].list.forEach(function(x){x.checked=b;});
              /*$scope.XLfilters.dict[field].list.forEach((x)=>{x.checked=b;});*/
            }

        $scope.clearAll = function(field) {
              $scope.XLfilters.dict[field].searchText='';
              $scope.XLfilters.dict[field].list.forEach(function(x){x.checked=true;});
              /*$scope.XLfilters.dict[field].list.forEach((x)=>{x.checked=true;});*/
            }

        $scope.XLfiltrate = function() {
            var i,j,k,selected,blocks,filter,option, data=$scope.XLfilters.all,filters=$scope.XLfilters.list;
            $scope.XLfilters.results=[];
            for (j=0; j<filters.length; j++) {
                filter=filters[j];
                filter.regex = filter.searchText.length?new RegExp(filter.searchText, 'i'):false;
                for(k=0,selected=0;k<filter.list.length;k++){
                    if(!filter.list[k].checked)selected++;
                  filter.list[k].visible=false;
                  filter.list[k].match=filter.regex?filter.list[k].title.match(filter.regex):true;
                }
                filter.isActive=filter.searchText.length>0||selected>0;
            }
            for (i=0; i<data.length; i++) {
                blocks={allows:[],rejects:[],mismatch:false};
                for (j=0; j<filters.length; j++) {
                  filter=filters[j]; option=filter.dict[data[i][filter.field]];
                  (option.checked?blocks.allows:blocks.rejects).push(option);
                  if(filter.regex && !option.match) blocks.mismatch=true;
                }
                if(blocks.rejects.length==1) blocks.rejects[0].visible=true;
                else if(blocks.rejects.length==0&&!blocks.mismatch){
                  $scope.XLfilters.results.push(data[i]);
                    blocks.allows.forEach(function(x){x.visible=true});
                    /*blocks.allows.forEach((x)=>{x.visible=true});*/
                }
            }
            for (j=0; j<filters.length; j++) {
                filter=filters[j];filter.options=[];
                for(k=0;k<filter.list.length;k++){
                  if(filter.list[k].visible && filter.list[k].match) filter.options.push(filter.list[k]);
                }
            }
        }


                    function createXLfilters(arr, fields) {
              $scope.XLfilters.all = arr;             
              for (var j=0; j<fields.length; j++) $scope.XLfilters.list.push($scope.XLfilters.dict[fields[j]]={list:[],dict:{},field:fields[j],searchText:"",active:false,options:[]});
              for (var i=0,z; i<arr.length; i++) for (j=0; j<fields.length; j++) {
                  z=$scope.XLfilters.dict[fields[j]];
                  z.dict[arr[i][fields[j]]] || z.list.push(z.dict[arr[i][fields[j]]]={title:arr[i][fields[j]],checked:true, visible:false,match:false});
              }
        }

        createXLfilters(usecaseData.list, ['searchId', 'ucname', 'company', 'division0', 'valueChain0', 'country', 'aiuc', 'resPerson', 'resPersonEmail', 'assocPerson1', 'assocPersonEmail1', 
            'pocSwarm', 'respBusinessUnit', 'emailRespBusinessUnit', 'businessDept', 'respItx', 'emailRespItx', 'itxDept', 'externalPartner', 'ucFullName', 'businessNeed', 
            'rolesResponsibilities', 'appearanceDate', 'dependencies', 'expetedBenefit', 'monetaryBenefit', 'problemType', 'method', 'dataSources', 'monetizeData', 'knowCustomer', 
            'incUtilization', 'monetization', 'stratAddedValue','feasibility', 'mvp', 'tagsKeywords', 'phase', 'activity', 'ucStatus', 'activityStart', 'curStatusComments', 'nextSteps', 
            'pocStartDate', 'availabilityDate', 'pocPresentationDate', 'decisionDate', 'appLiveDate', 'pocResult', 'pocTargetDate', 'datePocClosing']);
        //createXLfilters(vm.usecase_overview, ['ucname','resPerson']);             
    });

var usecaseData=UseCaseOverview.get（函数（）{
$scope.XLfilters={list:[]，dict:{}，results:[]}；
$scope.markAll=函数（字段b）{
$scope.XLfilters.dict[field].list.forEach（函数（x）{x.checked=b；}）；
/*$scope.XLfilters.dict[field].list.forEach（（x）=>{x.checked=b；}）*/
}
$scope.clearAll=函数（字段）{
$scope.XLfilters.dict[field].searchText=''；
$scope.XLfilters.dict[field].list.forEach（函数（x）{x.checked=true；}）；
/*$scope.XLfilters.dict[field].list.forEach（（x）=>{x.checked=true；}）*/
}
$scope.xlfilter=函数（）{
变量i、j、k、所选、块、筛选器、选项、数据=$scope.XLfilters.all、筛选器=$scope.XLfilters.list；
$scope.XLfilters.results=[]；
对于（j=0；j0；
}
对于（i=0；i最后，在对代码进行研究之后，我提出了一个解决方案。
当找不到元素时，列表返回undefined。因此它不能使用空值

只需在控制器的xlfilter函数中添加一个未定义的检查，就可以了

if(filter.list[k].title){
                      filter.list[k].match=filter.regex?filter.list[k].title.match(filter.regex):true;
                  }

@我得到的选项和结果数组是空白的。你知道吗？