Javascript UI框架/库如何解析HTML标记中的代码

我很想知道Angular等框架如何将标记中的文本转换为JavaScript。例如：

<h2>Products</h2>

<div *ngFor="let product of products">

  <h3>
    <a [title]="product.name + ' details'">
      {{ product.name }}
    </a>
  </h3>

</div>

产品
{{product.name}

考虑到在上述代码中，

product.name

被编码为一个字符串，因此如何将上述

product.name+'details'

转换为JavaScript代码

product.name

。 在某种意义上，我想知道如何解析HTML属性值并将其转换为JavaScript代码。

---

这个问题不仅仅是关于Angular的，更像是一个一般性的问题，比如JavaScript库/框架如何处理HTML标记中的嵌入代码？

我认为这取决于框架本身的机制这里有一些资源可能对Angular有用，它被称为数据绑定：React使用钩子和状态hanks来进行响应，但是我的问题与框架/库无关。我想知道的是如何解析/处理代码，以便将作为字符串编写的内容（即“Product.name+‘details’”）解释/转换为JavaScript？