Steps to delete an element from an array using an if-else statement

Question

Steps to delete an element from an array using an if-else statement

Task:

If the selected hour is 0, only display options for 15, 30, and 45 minutes.
For hours 1, 2, 3, or 4, show options for 0, 15, 30, and 45 minutes.

I am looking to simplify this conditional statement.

onHourChange(hours: number) {

if (hours === 0) {
 this.minuteOptions = [
  { value: 15, display: '15' },
  { value: 30, display: '30' },
  { value: 45, display: '45' },
 ]


} else if (hours === 1) {
  this.minuteOptions = [
    { value: 0, display: '00' },
    { value: 15, display: '15' },
    { value: 30, display: '30' },
    { value: 45, display: '45' },
  ];

}

Utilize this array to remove elements when the value 0 is selected

  ngOnInit() {
    this.hourOptions = [
      { value: 0, display: '0' },
      { value: 1, display: '1' },
      { value: 2, display: '2' },
      { value: 3, display: '3' },
      { value: 4, display: '4' },
    ];
    this.minuteOptions = [
      { value: 0, display: '00' },
      { value: 15, display: '15' },
      { value: 30, display: '30' },
      { value: 45, display: '45' },
    ];

javascript angular typescript forms

Answer 1

Answer №1

One can explore various approaches for deleting an element from an array.

Displayed below is a snippet showcasing examples utilizing the filter, slice, and splice array methods to remove items.

class TimeFilter {
  onHourChange(hours) {
    const noZeroMinutes = item => !(hours === 0 && item.value === 0);
    
    this.minuteOptions = [
      { value: 0, display: '0' },
      { value: 15, display: '15' },
      { value: 30, display: '30' },
      { value: 45, display: '45' },
    ].filter(noZeroMinutes); // filter the elements that have 0 minute and 0 hours
  }
}

class TimeSlice {
  onHourChange(hours) {
    this.minuteOptions = [
      { value: 0, display: '0' },
      { value: 15, display: '15' },
      { value: 30, display: '30' },
      { value: 45, display: '45' },
    ];
    
    if (hours === 0) {
      this.minuteOptions = this.minuteOptions.slice(1); // remove first element from the array
    }
  }
}

class TimeSplice {
  onHourChange(hours) {
    this.minuteOptions = [
      { value: 0, display: '0' },
      { value: 15, display: '15' },
      { value: 30, display: '30' },
      { value: 45, display: '45' },
    ];
    
    if (hours === 0) {
      this.minuteOptions.splice(0, 1); // remove first element from the array
    }
  }
}

const time = new TimeFilter();
// const time = new TimeSlice();
// const time = new TimeSplice();

time.onHourChange(0);
console.log(time.minuteOptions);
time.onHourChange(5);
console.log(time.minuteOptions);

Answer 2

One can explore various approaches for deleting an element from an array.

Displayed below is a snippet showcasing examples utilizing the filter, slice, and splice array methods to remove items.

class TimeFilter {
  onHourChange(hours) {
    const noZeroMinutes = item => !(hours === 0 && item.value === 0);
    
    this.minuteOptions = [
      { value: 0, display: '0' },
      { value: 15, display: '15' },
      { value: 30, display: '30' },
      { value: 45, display: '45' },
    ].filter(noZeroMinutes); // filter the elements that have 0 minute and 0 hours
  }
}

class TimeSlice {
  onHourChange(hours) {
    this.minuteOptions = [
      { value: 0, display: '0' },
      { value: 15, display: '15' },
      { value: 30, display: '30' },
      { value: 45, display: '45' },
    ];
    
    if (hours === 0) {
      this.minuteOptions = this.minuteOptions.slice(1); // remove first element from the array
    }
  }
}

class TimeSplice {
  onHourChange(hours) {
    this.minuteOptions = [
      { value: 0, display: '0' },
      { value: 15, display: '15' },
      { value: 30, display: '30' },
      { value: 45, display: '45' },
    ];
    
    if (hours === 0) {
      this.minuteOptions.splice(0, 1); // remove first element from the array
    }
  }
}

const time = new TimeFilter();
// const time = new TimeSlice();
// const time = new TimeSplice();

time.onHourChange(0);
console.log(time.minuteOptions);
time.onHourChange(5);
console.log(time.minuteOptions);

Steps to delete an element from an array using an if-else statement

Answer №1

Similar questions

Create a boundary on a three-dimensional design that follows the shape of its exterior

What is the best way to extract the image url from a page in WordPress?

Creating a wrapper for methods of a third-party class in TypeScript

Only carry out a redirect to the specified page if the successRedirect is present in the passport.authenticate function

`Why won't the checkbox uncheck when the dropdown is changed in jQuery?`

Issue with Backbone collection not being updated despite making a JSONP request

Using Vue to fetch JSON data with Axios

Creating a Fixed HeaderToolbar in FullCalendar React

Instructions on how to retrieve all store items while filtering in React JS and Redux

Tips for resolving a jspdf naming collision situation

Ways to extract particular keys from a JSON array?

Is it possible to utilize the inputted value from ng-model to populate an Angular ng grid?

Error encountered when running shell command in JavaScript due to permission denial

Drag and drop to upload files

Internationalization of deferred-loaded modules within the JHipster application

reCAPTCHA using AJAX verification consistently gives incorrect results even when the input is correct

Puppeteer: Easily choosing a dropdown selection by its displayed text

Suggestions for resetting the input field IDs in a cloned div after deletion

What is the method for utilizing Jquery to target the width value of an inline property?

I am currently facing a problem with the PrimeNG calendar feature that is causing issues with setting the minimum date for December and disabling the minimum year