Tengo una vista en la que una parte carga otra dentro del uso del enrutamiento. Aquí está la parte que carga otra:

 <a href="/productDetails/{{product.ProductId}}">{{product.Name}}</a>

Y aquí está el div donde tengo cargado mi otro componente (productDetails):

 <div class='col-md-6 body-content'> <router-outlet></router-outlet> </div>

Eso funciona bien. Pero, cada vez que se carga el componente, el componente de alojamiento se actualiza y pierdo su estado. No sé por qué sucede este comportamiento porque codifiqué la misma aplicación en AngularJS y funciona como se esperaba.