title: One way binding objects in Angular 2
body: <p>I'm doing the official <a href="https://angular.io/docs/ts/latest/tutorial/toh-pt3.html" rel="nofollow noreferrer">Tour of heroes</a> tutorial on Angular 2. They pass an object into the target of another component:</p>
  
  <pre><code>&lt;my-hero-detail [hero]="selectedHero"&gt;&lt;/my-hero-detail&gt;
  </code></pre>
  
  <p>As far as I understand, <code>[hero]="selectedHero"</code> means one way binding the object <em>reference</em>. Thus, any modifications to <code>hero</code> within <code>my-hero-detail</code> will also affect <code>selectedHero</code>, since they reference the same object.</p>
  
  <p>How can I enforce literal one way binding, like passing a deep? shallow? copy of <code>selectedHero</code> to <code>my-hero-detail</code>?</p>
  
  <p>In Angular <strong>1</strong>.5, you can allegedly declare one way binding attributes in components: <code>scope: { hero: '&lt;' }</code>. Is this missing in Angular 2?</p>
  
  <p>--</p>
  
  <p>I assume this was implemented by design, so we actually work by reference and copy only those properties that are needed.</p>