Obervable.remove(val) would not trigger .map, .flatMap or .onValueChanged

Hey Fusers Crew,

It seems that using the Observable operator .remove does not seem to trigger any subscribed listeners (map, flatMap or onValueChanged) as opposed to .add which triggers with a map or flatMap but NOT onValueChanged.

Below is a basic repro:

<App>
	<JavaScript>
	var Observable = require("FuseJS/Observable");
	var obs = Observable("Jane");

	function log(val) {
		console.log("Obs Changed");
	};

	exports.obs = obs;

	exports.add = function() {
		obs.add("Derek");
	};

	exports.remove = function() {
		obs.remove("Derek");
	};

	//  obs.onValueChanged(function() {
	// 	log();
	// });

	exports.change = obs.flatMap(function() {
		log();
	});
	</JavaScript>

	<StackPanel>
		<Each Items="{obs}">
			<Text Value="{}" />
		</Each>

		<Button Text="Add" Clicked="{add}"/>
		<Button Text="Remove" Clicked="{remove}"/>
	</StackPanel>
</App>

Run, Preview and take notice on how when ADD button is clicked, the log func is ran but REMOVE would not, even though you can evidently see that the Observable did react.

Additional Information =

Fuse Version: v.0.28.0 (Build 8142)
OS: Windows 10

Cheers,
Elizabeth

Hi!

This is the expected behavior. The mapping functions only run when new values are inserted. .remove() simply removes the item and does not require re-mapping anything.

onValueChanged only cares about the first value in the observable (.value).

Thanks.

Hi Anders,

Thanks for your reply.

So is this safe to say that Observable’s List does not have any Operators that’ll react to changes?

Cheers,

Elizabeth

There are lots of operators that react to changes, but WHAT they react to is very precise.

If you want to get absolutely all events flowing through an observable, you can use addSubscriber()/removeSubscriber().

What precisely are you trying to accomplish?

Well, I wanted the log(); function to run whenever the obs list changes, for BOTH added or removed changes. But all operators can only respond to either one.

I do not know how you guys do it but the Selection Api, does allow me to accomplish this.
And that is my current workaround, though it is an inconvenience for me, when I do not need the Selection Api but just using it for this sole purpose.

As for addSubscriber()/removeSubscriber() I don’t exactly remember where (believe on a slack convo) but I recall you mentioning these are suggested to be used seldomly and it is best to use the operators at all times. Therefore I’ve tried to stay away from them if I can. :smiley: Please correct me if I’m wrong.

Cheers,

Elizabeth

addSubscriber/removeSubscriber should be used seldomly as there are often better fits for what you’re trying to acccomplish; this is correct. However, I think in this case you want exactly that - to subscribe to changes on an Observable to see how it’s changing, no matter what those changes are. So they sound appropriate in this case. :slight_smile: