从后端收到的着色评论回复用户名为 innerHTML

问：

我将评论文本保存到后端数据库，如果评论是回复，我还想包括接收回复的评论的用户用户名。我尝试通过添加html类和在css中为这个类赋予颜色来赋予它颜色。我发现的方法之一是保存带有用户名包含在跨度中的注释，然后将其显示为 innerHTML。不起作用。由于 im beggineer 我想知道这种方法在技术上是否可行/正确。如果没有，还有什么其他解决方案？无需添加颜色，它就可以工作。但是使用颜色，它会显示到带有所有跨度标签且没有颜色的用户界面。

    this.isLoadingSubject.next(true);
    const userId = this.dataSubject.value.data.user.id;
    const postId = this.responsivePostId;
    const mainComment = this.commentsWithReplies.find(
      (comment) => comment.comment.id === id
    );
    replyForm.value.comment_text = `<span class="colored-username">@${mainComment.comment.username}</span> ${replyForm.value.comment_text}`;
    replyForm.value.parent_comment_id = id;
    this.gardeningPostComment$ = this.userService
      .addGardeningPostComment$(userId, postId, replyForm.value)
      .pipe(` ....

和 html：

<p
                            *ngIf="currentEditIndex !== j"
                            class="comment-text"
                            [innerHTML]="
                              commentWithReplies.comment.comment_text
                            "
                          ></p>```