Angular Mysterious Routing

-

 I was working on an Angular app and one fine day I imported a module into another module. After doing so I noticed that the routing on my importee ( or whatever tf it's called ) is not working and it is replaced by the routing , of the imported module. 


After wasting a few good minutes I found out that the reason for this mysterious behavior is the ORDER in which you import these modules. If you import the imported module before the routing module of your importee module , then the visitor's routing will take over yours. 


Following screen shots explains this with sample modules. The file shown here is the innocent.module.ts  which is my importee. ImportedModule is the imported module.


OK

This order is OK as the InnocentRoutingModule is imported before ImportedModule . All good!





NOT OK

This order is NOT OK as the InnocentRoutingModule is imported after ImportedModule . Imported module routing will therefor take over , bad Angular bad ! 




So that's it guys ! Be mindful of the order you import stuff , that is the key takeaway ! Cheers ! 

Comments

Post a Comment

Popular posts from this blog

Wasted about an hour of my life on something so trivial

-
Image
 Ok guys so i wasted about an hour trying to figure out how to bind to the "disabled" property in a textbox in angular. And after trying for a long time i realized that my code is not working as expected because , you have to use null instead of "false" to control it. Please refer to the stackoverflow answer below. Darn it ! https://stackoverflow.com/questions/42179150/how-to-disable-a-input-in-angular2/43765804
Read more

Connecting to AWS DynamoDb with .NET CORE

-
Image
Recently i was trying out this course on Udemy on designing microservices architecture based solutions with .NET core and AWS. It was a good course but like most Udemy courses ( ahem ) it had some holes here and there. One of the things i found most troubling is that it did not explain how to connect to AWS' DynamoDb which they was used as the database for the course project, using .NET core. When i checked the questions section of Udemy it was evident to me that i was not the only guy having this problem. Also the information on the all mighty internet was a bit scattered on this problem so i had to read a lot. There WAS instructions on the AWS documentation but it was...let's say i was too stupid to understand it!  So therefor , here are the steps i followed to get my solution working , if you are stupid like me i hope you will find this useful :) Step 1 Create an AWS account , if you don't have one already. Im a poor developer so i only have a humble free tier account.
Read more

GIT Cherry Picking

-
Image
 Ever had a colleague telling you "hey bro can you please have a look at this commit ?" , or you tell a colleague "hey bro , please check the changes i made with this commit" ? Basically someone else asking you to check the changes they made with a specific commit ? In such a case how do you get the files by a specific commit to your local computer ? Well me , until today , I have been copying those files manually to my local like an idiot. But just now I found out that you can use the built in git command of git cherry-pick for this kind of work!  Just type git cherry-pick <commit-hash> and you can get your buddy's code onto your local with a blink of an eye. This will automatically commit the commit to your local though , so if you are a man of culture like me just use  git cherry-pick -n  to stop it from committing. This still stages the changes but least you can have a look at the diff easily this way. I'm pretty sure there must be plenty of other
Read more