当与innerHtml一起使用时，jquery委托不绑定到所有元素

Question

我有以下模板：

<p id="myWrapper" innerHtml="{{myHtmlValue}}"></p>

在我的打字稿上，我有以下

apiCallIAmDoing.subscribe(response => {
   this.myHtmlValue = 'bla <a class="val1">test1</a>  bla <a class="val2">test2</a>';
   $('#myWrapper').delegate('a', 'click', event => {
         console.log('test binding');
   });
})

对于val2它可以工作，但是对于val1它没有。我错过了什么？

普拉克： https://plnkr.co/edit/LU1QiaH7uX0lOI2tOFKr?p=preview

Answer 1

尝试使用on，就像这样：

   $('#myWrapper').on('click', 'a', function() {
         console.log('test binding');
   });