cyberbeast cyberbeast - 1 year ago 119
TypeScript Question

How to pass the value of an expression back to data target in angular2?

I am trying to pass back the id of an element back to my target. I have multiple ace-editor instances on my page. I would like to know which one is sending me a "textchanged" event, so that I can sync the content of the correct tuple in my array.

<md-grid-tile *ngFor="let card of function_cards">
Some content here.

<div ace-editor
style="min-height: 200px;
overflow: auto;"
(click) = "setId({{}})"></div>

My typescript code is as follows:

private function_cards: CodeEditor[] = [{
id: 1,
code: "something"
id: 2,
code: "something else"

setId(id: number){
this.text_editor_id = id;
console.log("CLICKED ON: " + id)

onChange(code) {
console.log("new code", this.text_editor_id);
this.function_cards[this.text_editor_id].code = code;

This implementation does not work. I can't seem to figure out what is wrong. Also, is this the best way to do this? I need to keep track of changes made in different ng2-ace-editor instances.

Answer Source

You can send the card id in the onChange event:


The problem you are probably having is that you have these {{ brackets in your click handler and these are not necessary here. This will work:


However I don't believe you need this function. Hope this helps!

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download