0

I've searched everywhere on the internet and I cannot figure out the answer. I was wondering if it was possible to data bind an Angular Element's input AFTER its been turned into a script and brought into plain HTML/JavaScript files. I've tested data binding an Angular Element within an Angular environment and it worked fine. It's only when I bring it out as a script to plain HTML/JavaScript where it stops working. Is it possible to do it and if so can someone please show me an example?

We have our Angular Element called my-element and I want to data bind a boolean value to its input.

public _random: boolean = false;
@Input()
get random(): boolean {
   return this._random;
}
set random(value: boolean){
   this._random = value;
}

Then in the plain HTML/JavaScript file where we bring the Angular Element in as a script we have

<my-element [random]="true”></my-element>
Koreanwest
  • 49
  • 4

2 Answers2

1

Yes it is possible . One-way data binding will bind the data from the component to the view (DOM) or from view to the component. One-way data binding is unidirectional. You can only bind the data from component to the view or from view to the component.

Two-way data binding in Angular will help users to exchange data from the component to view and from view to the component. It will help users to establish communication bi-directionally. For more information Explained here

Dev Shah
  • 60
  • 5
0
<my-element [random]="'true'"></my-element>

Actually, here you're trying to set string type value. And you have declared as boolean. So, that's why not working. So, code would be...

<my-element [random]="true"></my-element>
Sunny Prajapati
  • 79
  • 1
  • 6