To achieve your desired outcome, it is necessary to iterate through each item in the arrayList and check if there is a corresponding item in the activeCheckbuttons array with the same description. If a matching item is found, it should be added to the result; otherwise, it should be ignored:
const filteredList = this.arrayList.filter(item1 =>
!!activeCheckbuttons.find(item2 => item1.Description === item2.Description)
);
This code snippet operates as follows:
- The
filter method evaluates a predicate for each element in the array. If the predicate returns true, the element is included in the output; otherwise, it is skipped.
- Within the predicate, the
find method is utilized to ascertain whether the current item exists in the activeCheckbuttons array based on their descriptions. The first matching element returned by find causes the predicate to evaluate to true. Conversely, if no match is found, null is returned, leading to a false evaluation and exclusion from the filtered list.
The usage of the !! operator in this context is aimed at converting objects to true and null values to false:
!!{} results in true!!null results in false
Although this conversion step might not be strictly necessary, I employ it for clarity in indicating that my intention is to obtain either true or false, rather than objects or null values.
The key issue in your existing code lies in filtering the second array, eliminating elements without matching descriptions to the item being checked. Given the assumption that distinct items have different descriptions, the main filter operation will invariably return at least one element, causing the overall filter process to yield an empty array.
If this approach does not align precisely with your filtering requirements, please provide further details, and I can adjust the code accordingly.