what is an elegant way to trigger selection of the first item in this scenario? : <p>I have a master-detail setup like this:</p>

<p><a href="https://stackblitz.com/angular/jxgxoekjyeb?file=src%2Fapp%2Fhero-detail%2Fhero-detail.component.html" rel="nofollow noreferrer">https://stackblitz.com/angular/jxgxoekjyeb?file=src%2Fapp%2Fhero-detail%2Fhero-detail.component.html</a></p>

<p>I want the default browser display to show the detail view of the first master item.  In the example provided at the url above, a detail item isn't displayed until a user manually selects an item from the master list. What would be an elegant way to dynamically trigger selection of the first item in this scenario so that the detail view is displayed on page load?</p>
