Angular Component property not resetting on route navigation

Question

How do I reset my component property value while my RouteParams change

i am having one checkbox in my component , that component i have used in routing with parameter.

Detail Component having myProp property which is assigned to my checkbox .

Ex:
1. myapp/detail/1
2. myapp/detail/2

The problem is when i am in checking the checkbox in one route and i am navigating to same route with different param the check box checked remains the same .

How to reset the checkbox selection while navigation between the same routes with different param?

While consoling the property on the life cycle hook events giving default value[false] but the checkbox is checked on the view

My Stackblitz code

Answer 1

The binding of the checkbox is not two-way bound.

Try this:

<input type="checkbox" [(ngModel)]="myProp" /> MyCheckbox