Angular 在角度组件html模板中使用getter

我有一个数据模型类，比如：

class Question {
    body: string;
    
    get bodyForTableRow(): string {
        return this.body.replace("\n", " // ");
    }
}

在组件html模板中，我使用以下声明来计算getter值：

 {{ oneQuestion.bodyForTableRow }}

但是我得到的不是value，而是一个空字符串，其中新行被替换为

/

符号

当我使用

 {{ oneQuestion.body }}

它显示正文内容

为什么会这样？我是否应该始终使用实字段将它们映射到html组件，并且getter不适合这种情况

---

更新 当模板中的声明如下所示时

<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
  <!-- other columns skipped --> 

  <ng-container matColumnDef="body">
    <th mat-header-cell *matHeaderCellDef>Question Body</th>
    <td mat-cell *matCellDef="let oneQuestion">
      {{ oneQuestion.body }}
    </td>
  </ng-container>
</table>

它显示空行

---

更新2 问题数据模型类声明如下：

export class QuestionDataModel {
  body: string; // public access field for template
  
  constructor(bodyValue: string) {
    this.body = bodyValue;
  }  
  
}

  dataSource: QuestionDataModel[];

数据源声明如下：

export class QuestionDataModel {
  body: string; // public access field for template
  
  constructor(bodyValue: string) {
    this.body = bodyValue;
  }  
  
}

  dataSource: QuestionDataModel[];

我通过rest调用填充数据源

const url: string = `/questions/all`;
this.http.get(url).subscribe(
  (data: QuestionDataModel[]) => {
    this.dataSource = data;
  },
  (error) => this.reportServerError(error)
);

---

您所做的应该是可行的，您还遇到了一些其他问题，比如没有正确地实例化类，但是您可能真的想重新构造以使用setter来代替

class Question {
    private _body: string;

    set body(body: string) {
      this.bodyForTableRow = body.replace("\n", " // ");
      this._body = body;
    }
    get body() {
      return this._body;
    }
    
    bodyForTableRow: string;
}

角度变化检测的工作方式是，它在每个变化检测周期中对函数进行评估，这可能非常频繁，因此通过将

replace

放在getter中，您可以在每个周期中运行它。使用这种结构，您只需在需要时运行和设置它

要使用此类或任何类，您需要使用

new

关键字

this.oneQuestion = new Question();
this.oneQuestion.body = 'my string with line returns \n next line';

---

您所做的应该是可行的，您还遇到了一些其他问题，比如没有正确地实例化类，但是您可能真的想重新构造以使用setter来代替

class Question {
    private _body: string;

    set body(body: string) {
      this.bodyForTableRow = body.replace("\n", " // ");
      this._body = body;
    }
    get body() {
      return this._body;
    }
    
    bodyForTableRow: string;
}

角度变化检测的工作方式是，它在每个变化检测周期中对函数进行评估，这可能非常频繁，因此通过将

replace

放在getter中，您可以在每个周期中运行它。使用这种结构，您只需在需要时运行和设置它

要使用此类或任何类，您需要使用

new

关键字

this.oneQuestion = new Question();
this.oneQuestion.body = 'my string with line returns \n next line';

---

---

您是否真的在创建

Question

类的实例？仅使用类型断言不会创建

Question

的实例，您也无权访问getter/setters/其他方法。@cjd82187我已发布了问题的更新。它澄清了吗？@Rafael否更新没有澄清，我们需要看看在这种情况下，您是如何获取和创建

数据源的。好像有什么可疑的事情发生了。@bryan60我将很快更新我的问题。谢谢。@bryan60我又更新了我的问题。你真的在创建
question
类的实例吗？仅使用类型断言不会创建
Question
的实例，您也无权访问getter/setters/其他方法。@cjd82187我已发布了问题的更新。它澄清了吗？@Rafael否更新没有澄清，我们需要看看在这种情况下，您是如何获取和创建
数据源的。好像有什么可疑的事情发生了。@bryan60我将很快更新我的问题。谢谢。@bryan60我又更新了我的问题。我的问题是，我应该像您声明的
bodyForTableRow:string
那样，用一个“实”字段来存储值，还是有一个getter就足够了。据我所知，只有getter，使用
body
字段计算其值是行不通的。我应该将处理后的数据保存到另一个实际字段并使用它。我说得对吗？这两种方法都应该有效，但使用“真实”字段更有效，性能也更好。您有另一个与导致问题的getter无关的问题。谢谢您，我理解，预计算字段的性能应该更好。我只是想知道为什么这个getter在我的情况下不起作用。我的方法有什么问题。我对Java/C有一些经验，据我所知，如果我有一个类实例，我可以使用getter根据这个类实例获得一个计算值。为什么不在这种情况下呢？问题是您没有使用
new
关键字在任何地方创建类实例。您只是在声明类型，它不是这样工作的，您需要实际创建类。TS认为你并没有撒谎，但你确实在撒谎。因为getter是一个类特性，需要你实例化一个类。您没有类实例数组。您有一个对象数组，其中没有任何您期望的关联类功能，并且您正在向typescript谎报的类型，我的问题是，我是否应该像您声明的
bodyForTableRow:string
那样有一个“实”字段来存储值，或者有一个getter就足够了。据我所知，只有getter，使用
body
字段计算其值是行不通的。我应该将处理后的数据保存到另一个实际字段并使用它。我说得对吗？这两种方法都应该有效，但使用“真实”字段更有效，性能也更好。您有另一个与导致问题的getter无关的问题。谢谢您，我理解，预计算字段的性能应该更好。我只是想知道为什么这个getter在我的情况下不起作用。我的方法有什么问题。我对Java/C有一些经验，据我所知，如果我有一个类实例，我可以使用getter根据这个类实例获得一个计算值。为什么不在这种情况下呢？问题是您没有使用
new
关键字在任何地方创建类实例。您只是在声明类型，它不是这样工作的，您需要实际创建类。TS认为你并没有撒谎，但你确实在撒谎。因为getter是一个类特性，需要你实例化一个类。您没有类实例数组。您有一个对象数组，其中没有您期望的关联类功能，并且您正在向typescript谎报，