范围值更改时如何过滤角度md-option中的下拉列表

Question

I have a dropdown menu using with the data array

data = [{type:"day", value:"daily"}
        ,{type:"hour", value:"hourly"}
         ,{type:"month", value:"monthly"}] 

and also i have flag in my environment variable as

enableHourly = "true"
enableDaily = "true"
enableMonthly = "true"

by setting one of the value in false the value should be change like

if enableHourly = "false"

in the md-options select should only display day and month

this is what i try but it seems its not working atm.

self.timeExecutionList = () => {
            // check if hourly, daily, weekly, monthly tag is true or false string then remove to
            // the array
            if (self.beebotCreate) {
                var arr = self.timeTypeList;
                for( var i = 0, n = arr.length; i < n; i++){ 
                    if (arr[i].includes('hr') && self.beebotRunHourly !== "true") {
                      arr.splice(i, 1); 
                    }

                    if (arr[i].type === 'day' && self.beebotRunTimeOfDay !== "true") {
                        arr.splice(i, 1); 
                    }

                    if (arr[i].type === 'week' && self.beebotRunMonthly !== "true") {
                        arr.splice(i, 1); 
                    }

                    if (arr[i].type === 'month' && self.beebotRunMonthly !== "true") {
                        arr.splice(i, 1); 
                    }
                    i--
                 }

                return arr
}

if you have cleaner solution would be appreaciated

Answer 1

I feel you could add the boolean value to the data field with default settings and make use of the boolean variable to populate the dropdown. slicing array is expensive.

data = [{type:"day", value:"daily", "enabled" : true}
        ,{type:"hour", value:"hourly","enabled" : true}
        ,{type:"month", value:"monthly", "enabled" : true}]

In html, for all options, if the flag is set to true, add it to dropdown else not. Hope that helps

<md-select> 
     <div ng-repeat="type in data" >
     <md-option *ngIf="type.enabled" ng-value="{{value}}">
          {{type.value}}
     </md-option>
     </div>
</md-select>`