3

I'm doing the official Tour of heroes tutorial on Angular 2. They pass an object into the target of another component:

<my-hero-detail [hero]="selectedHero"></my-hero-detail>

As far as I understand, [hero]="selectedHero" means one way binding the object reference. Thus, any modifications to hero within my-hero-detail will also affect selectedHero, since they reference the same object.

How can I enforce literal one way binding, like passing a deep? shallow? copy of selectedHero to my-hero-detail?

In Angular 1.5, you can allegedly declare one way binding attributes in components: scope: { hero: '<' }. Is this missing in Angular 2?

--

I assume this was implemented by design, so we actually work by reference and copy only those properties that are needed.

Improve this question
4
  • By binding to a deep or shallow copy. Angular2 doesn't provide anything. Lookup cloning objects in TypeScript. Commented Dec 13, 2016 at 15:36
  • Yes, that's "by design" - but not of Angulars design, but of TypeScripts ;-) Commented Mar 20, 2017 at 17:45
  • Use an Object.assign({}, yourObject); to copy without keeping object two-way binded. Commented May 15, 2017 at 11:01
  • which would be a shallow copy, not a deep one. but a solution surely yes Commented May 15, 2017 at 13:03
Related questions
3
One way binding to an object in angular
1
Two-way binding in Angular 2
0
One way binding with object angularjs component
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.