技術ネタ。電車でブログってるから技術ネタが書きづらい書きづらい。
angular4にて、innerHTMLで埋め込む必要があってaタグとかぶっこんでるんだけどイベントが取れない。
以下のようなコードを入れたんだけど普通に無理だった。
import {Component} from 'angular2/core'; @Component({ selector : 'sub-child', template : '<form [innerHTML]="html"></form>' }) export class SubChildClass { private html:string; private buttonText:string; constructor() { this.buttonText = 'A new button'; this.create(); } private create() { this.html = "<button (click)='new() '>" + this.buttonText + "</button>" } private new() { this.buttonText = "Text Changed"; } }
余裕で(click)='new()がかき消される。
domでいろいろやれば出来るけどクソめんどいよって記事がstackoverflowにあった(英語だけどそんな感じで書いてあった、リンク忘れたから今度はる)んでクリックイベントを取ってそこから処理を書く方法に変更。
HostListenerってやつ使ってクリックイベント取ってdomる。
///宣言 import { Component, HostListener } from '@angular/core'; // clickイベントを宣言 @HostListener('click', ['$event']) onClick(event) { //ここでいろいろ }
いやー感覚でangular4いじってたけどこれは感覚じゃわからんかったー。angularくそおもしろい