Angular中Observable<string>函数未返回完整拼接内容的解决方法

你遇到的核心问题是误用了RxJS的do操作符——它仅用于执行副作用操作（比如打印日志、修改外部变量），完全不会改变Observable最终发射的值。你在do里写的return根本不会影响Observable的输出，所以最终返回的还是this.translate.get(...)的结果（也就是翻译后的月份文本），而不是你想要的拼接字符串。

正确的实现方式 #

把do换成map操作符，map的核心作用就是转换Observable发射的数据，正好用来把翻译后的月份和日、年拼接成目标格式：

showDate(date): Observable<string> {
  // 先处理日期拆分，得到日、月、年数组
  const dateNew = this.datePipe.transform(this.dateTimePipe.transform(date), "dd/MM/yyyy").split('/');
  
  // 用map替换do，转换翻译后的结果
  return this.translate.get(this.getMonthByNumber(dateNew[1])).pipe(
    map(monthTranslation => {
      // 这里返回拼接后的字符串，会成为Observable最终发射的值
      return `${dateNew[0]} de ${monthTranslation} de ${dateNew[2]}`;
    })
  );
}

额外注意事项 #

• 确保getMonthByNumber函数返回的是翻译文件中对应的月份键（比如'JANUARY'、'FEBRUARY'这类能被translate.get正确识别的键）
• 如果你用的是RxJS 6+版本，记得要把操作符放到pipe()里（上面的代码已经遵循了这个规范）
• 可以考虑添加错误处理，比如用catchError操作符处理日期转换失败或者翻译键不存在的情况：

  import { catchError } from 'rxjs/operators';
  import { of } from 'rxjs';
  
  // ...
  return this.translate.get(this.getMonthByNumber(dateNew[1])).pipe(
    map(monthTranslation => `${dateNew[0]} de ${monthTranslation} de ${dateNew[2]}`),
    catchError(() => of('日期格式错误')) // 出错时返回默认文本
  );
  

内容的提问来源于stack exchange，提问作者Nmaster88