Bind html string in controller to template does not trigger click event

I have a html string in controller and I bind this to view, but the action does not trigger on clicking.

I already applied the triple braces or htmlSafe to avoid html escape, the button shows on the template but when clicking on it does not trigger action newAlert

## hello.js

import { htmlSafe } from '@ember/string';
import { computed } from '@ember/object';

export default Controller.extend({
  htmlString: computed(function() {
    return htmlSafe('<button >Test Alert</button>')
  }),
  actions: {
    newAlert: function(){
      alert('Hello')
    }
  }
});

## hello.hbs

Could you guys help me shows what is going wrong?