如何将表达式的值传递回angular2中的数据目标？

Question

我正在尝试将元素的 ID 传回我的目标。我的页面上有多个 ace-editor 实例。我想知道哪个向我发送 "textchanged" 事件，以便我可以同步数组中正确元组的内容。

<md-grid-tile *ngFor="let card of function_cards">
    <md-card>
        Some content here.
    <pre>{{card.code}}</pre>
    <pre>{{card.id}}</pre>

    <div ace-editor 
       [text]="code"
       [mode]="'python'"
       [theme]="'eclipse'"
       [options]="options"
       [readOnly]="false"
       [autoUpdateContent]="true"
       (textChanged)="onChange($event)"
       style="min-height: 200px; 
       width:100%; 
       overflow: auto;" 
       (click) = "setId({{card.id}})"></div>
    </md-card>
</md-grid-tile>

我的打字稿代码如下：

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;
}

此实现无效。我似乎无法弄清楚出了什么问题。另外，这是最好的方法吗？我需要跟踪在不同的 ng2-ace-editor 实例中所做的更改。

Answer 1

您可以在onChange事件中发送卡片id：

 (textChanged)="onChange($event, card.id)"

您可能遇到的问题是您的点击处理程序中有这些 {{ 括号，而这些在这里不是必需的。这将起作用：

 (click)="setId(card.id)"

但是我认为您不需要此功能。希望这对您有所帮助！

如何将表达式的值传递回angular2中的数据目标？

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

typescript

angular2-template

angular