下面是一个示例代码，展示了如何使用Angular 9来实现当用户输入内容时，将文本框的高度扩展，并在点击外部时恢复正常大小。

首先，我们需要创建一个名为textarea-resize.component.ts的组件文件，并添加以下代码：

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

@Component({
  selector: 'app-textarea-resize',
  templateUrl: './textarea-resize.component.html',
  styleUrls: ['./textarea-resize.component.css']
})
export class TextareaResizeComponent {
  public isExpanded: boolean = false;

  @HostListener('document:click', ['$event.target'])
  onClick(targetElement: any) {
    const clickedInside = this.elementRef.nativeElement.contains(targetElement);
    if (!clickedInside && this.isExpanded) {
      this.isExpanded = false;
    }
  }

  toggleExpand() {
    this.isExpanded = !this.isExpanded;
  }
}

然后，在与组件文件相同的目录下，创建一个名为textarea-resize.component.html的HTML模板文件，并添加以下代码：

最后，在与组件文件相同的目录下，创建一个名为textarea-resize.component.css的CSS文件，并添加以下代码：

textarea {
  transition: height 0.3s;
}

textarea.expanded {
  height: 200px; /* 设置文本框的扩展高度 */
}

现在，我们可以在其他组件中使用TextareaResizeComponent组件，并在用户输入内容时实现文本框的高度扩展效果。

例如，我们可以在app.component.html中添加以下代码：

这样，当用户在文本框中输入内容时，文本框的高度将自动扩展。当用户点击文本框以外的区域时，文本框的高度将恢复正常大小。

希望这个示例对你有帮助！