Pfthb

Before, I know it is kind of stupid question but i'm interested of finding answer (Don't vote down :))

I used to have this problem with angularJS and now I'm learning angular 6 and hoped there is a solution for it (which I haven't found yet)

I've created 2 custom components. The father gets an object for binding and gives its property to the son component.

For ex.

Son Component

<div> value </div>

Father Component

<div>
 <son-component [value]="config.configSonValue"></son-component>
</div>

Usage of Father

<father-component [config]="myConfig"></father-component>

I'm skipping the code because it is not relevant to the question.

This is the myConfig value

this.sonValue = 1;
const myConfig = 
 configSonValue: this.sonValue // This line is the problem - loosing the reference

This makes the application run and show the 1.
But if i'm changing the value in my this.sonValue is not affecting the UI.

It makes sense cause the moment i'm setting the value of configSonValue the value from this.sonValue is being copied and not referenced while its primitive type.

Today i'm asking the user to provide me the scope object and the name of the variable he wants to bind.. and in the binding i'm doing scope[name].

I hoped there is something like

const myConfig = 
 configSonValue: angular.copyRef(this.sonValue) // wishful solution 

Here is an example https://stackblitz.com/edit/angular-2ta9ug

Is there ?