在Angular中，避免DOM注入的一个方法是使用属性绑定代替innerHTML。例如，在组件类中定义一个属性，并将其绑定到HTML中的元素上，而不是直接设置innerHTML。

以下是一个示例：

组件类：

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `
    {{ message }}
    

  `
})
export class AppComponent {
  message = 'Hello world!';
  content = 'Click me!';
}

该示例中，message属性使用双括号语法绑定到HTML中的元素。但是，将content属性绑定到内部HTML时，使用的是属性绑定。这样可以避免直接设置innerHTML，从而防止DOM注入攻击。

如果需要使用动态HTML，请确保将其转义。可以使用Angular的DomSanitizer服务来完成这个任务。例如，以下是一个使用DomSanitizer的示例：

import { Component } from '@angular/core';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';

@Component({
  selector: 'my-app',
  template: `
    {{ message }}
    

  `
})
export class AppComponent {
  message = 'Hello world!';
  unsafeContent = 'Click me!';
  safeContent: SafeHtml;

  constructor(private sanitizer: DomSanitizer) {
    this.safeContent = this.sanitizer.bypassSecurityTrustHtml(this.unsafeContent);
  }
}

在该示例中，unsafeContent定义了一个包含onclick事件的按钮元素。但是，将unsafeContent绑定到内部HTML时，使用的是属性绑定，并将其传递给DomSanitizer服务的bypassSecurityTrustHtml方法来转义内容。最终，safeContent属性包含了转义后的HTML代码，可以安全地绑定到innerHTML属性上。