要移除数组中具有相同名称元素的重复项，可以使用Angular的管道和内置的Set数据结构。

首先，创建一个自定义的管道：

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'removeDuplicates'
})
export class RemoveDuplicatesPipe implements PipeTransform {
  transform(value: any[], propertyName: string): any[] {
    // 使用Set数据结构来过滤重复项
    const uniqueValues = new Set();
    return value.filter(item => {
      if (!uniqueValues.has(item[propertyName])) {
        uniqueValues.add(item[propertyName]);
        return true;
      }
      return false;
    });
  }
}

然后，在你的组件中使用这个管道：

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

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

      
{{ item.name }}
    
  `
})
export class MyComponent {
  items = [
    { name: 'Apple' },
    { name: 'Banana' },
    { name: 'Apple' },
    { name: 'Orange' },
    { name: 'Banana' }
  ];
}

在这个示例中，我们通过管道removeDuplicates传递了要过滤的数组和要比较的属性名称。管道使用Set数据结构来保持唯一的属性值，然后通过filter方法过滤掉重复的元素。

在模板中，我们使用*ngFor指令来循环遍历过滤后的数组，并显示每个元素的名称。

最终的输出将是：

- Apple
- Banana
- Orange

这样就移除了数组中具有相同名称元素的重复项。