下面是一个示例代码，演示了如何在Angular中使用拖放指令向文件扩展名添加字符：

1. 首先，安装拖放模块：

npm install @angular/cdk

2. 创建一个拖放指令，例如drag-drop.directive.ts：

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

@Directive({
  selector: '[appDragDrop]'
})
export class DragDropDirective {

  @HostListener('dragover', ['$event'])
  onDragOver(event: DragEvent) {
    event.preventDefault();
  }

  @HostListener('drop', ['$event'])
  onDrop(event: DragEvent) {
    event.preventDefault();
    const files = event.dataTransfer?.files;
    if (files) {
      this.addExtension(files);
    }
  }

  addExtension(files: FileList) {
    for (let i = 0; i < files.length; i++) {
      const file = files[i];
      const fileName = file.name;
      const extension = fileName.substr(fileName.lastIndexOf('.') + 1);
      const newFileName = fileName.replace(`.${extension}`, `_new.${extension}`);
      console.log(newFileName);
    }
  }
}

3. 在模板中使用拖放指令，例如app.component.html：

  拖放文件到此处

通过以上代码，当用户将文件拖放到指定的div元素中时，会触发dragover和drop事件。在onDrop方法中，我们通过event.dataTransfer?.files获取拖放的文件列表。然后，我们遍历文件列表，并通过replace方法将文件扩展名替换为_new.扩展名，并打印出新的文件名。

注意：这只是一个简单的示例，你可以根据自己的需求进行修改和扩展。