Monitor the collection for changes before adding an item to the collection

Question

Monitor the collection for changes before adding an item to the collection

When using ui-select multiple, I am facing an issue where I need to check the collection before ng-model="collection" is updated in order to ensure that the new value is not already present in it. Simply watching the collection does not solve this problem because the item is added first and then the $watch function gets called.

The on-select event also did not help in this scenario because the collection gets updated before I can check if the currently clicked item is already included in it before getting pushed.

Is there any way I can test this before the ng-model is updated?

The main purpose of this is to avoid adding duplicates to the collection.

javascript angularjs ui-select

Answer 1

Answer №1

Assuming I comprehended the query accurately, here is a way to achieve it:

$watch('myArr', removeDuplicates);
removeDuplicates($scope.myArr)

function removeDuplicates(arr){
    ...
};

Answer 2

Assuming I comprehended the query accurately, here is a way to achieve it:

$watch('myArr', removeDuplicates);
removeDuplicates($scope.myArr)

function removeDuplicates(arr){
    ...
};

Monitor the collection for changes before adding an item to the collection

Answer №1

Similar questions

javascript hide rows without data

My goal is to develop a custom forEach function that retrieves a substring from each element in an array

Sequencing code execution correctly in Node.js

Problem with sidebar animation: Functioning properly when open, but closes abruptly without animation in React using Tailwind CSS

Transfer your documents effortlessly as soon as they are

Retrieve HTML classes within JavaScript textual templates

Neglecting to review the CSS - embracing ejs layouts in Express

What is the recommended approach for utilizing props versus global state within your components when working with JS Frameworks such as Vue?

Troubleshooting issues with document.querySelectorAll in JavaScript

Using injected services within static methods may seem tricky at first, but once you

Issue with VueJs router-link component

"Enhance your database by incorporating HTML link clicks through AJAX integration with PHP and MySQL

Using axiosjs to send FormData from a Node.js environment

Having trouble getting the JQuery Tipsy tooltip to display correctly with D3.js circles?

What is the best way to update the style following the mapping of an array with JavaScript?

What is the best way to ensure my php variable is easily accessed?

Moment JS initialization and the utc() function

Pass an array from a script file in JavaScript to index.js within the Express framework

Strange symbols were stored in the database after saving the textarea value

Is it possible for third party packages to function properly without the node_modules directory?