在下面的示例中，如何在x，y和total周围设置跨度标签，使其不是一个字符串？ 

 <div>
        {{GetNumbers()}}
    </div>

GetNumbers(){
const x = 10;
const y = 5;
total = 5;

return `${x} - ${y} of ${total}`;
}

#1楼 票数：2 已采纳

您可以将div的innerHTML属性设置为使用您的字符串，包括span标签： 

<div [innerHTML]="GetNumbers()"></div>

GetNumbers(){
  const x = 10;
  const y = 5;
  const total = 5;

  return `<span>${x}</span> - <span>${y}</span> of <span>${total}</span>`;
}

StackBlitz： https ：//stackblitz.com/edit/angular-vlp9au ？ file = src％2Fapp％2Fapp.component.ts

  ask by jaikl translate from so

未解决问题？本站智能推荐：

2回复

如何在跨度中对齐角度标签内容

我需要正确对齐两个信息，即采购订单号和供应商，怎么做？
1回复

如何在组件标签中设置一个对象的样式angular

我想在这个组件标签内的 [text] 中添加一个样式 任何人都可以帮助我想添加样式
2回复

Angular服务返回值，但未显示在页面中

我正在从头开始学习Angular。 我创建了一个名为“ mylink”的组件，并为其创建了一个服务。 我试图使用'observable，of'和'subscribe'从服务返回一个字符串值。 该服务返回字符串，但是不会显示在网页中。 调试时，在组件中，它表明接收到的数据是“输入的意外结
2回复

从离子模板中的方法获取返回值

我试图从离子模板中的方法获取返回值。 我所知道并尝试的是以下内容：- <button (click) = "getReturn(parameter)">btn</button> 这只是我尝试过的一个示例，但是我知道如何获取返回值。
1回复

使用指令返回值

我有返回标题或null的此指令，如何在html组件中使用此返回值？ 我想在工具提示标题中使用此值
2回复

如何在动态选择组件角度中的选择上设置默认值

我正在尝试为我的应用程序创建一个动态select组件。 在整个应用程序中，将以各种形式使用此组件。 在某些情况下，可能会有一些预定义的值可以提供给select ，在这种情况下，下拉列表会将值选择为默认值。 为了实现此功能，我查看了SO并找到了可以解决此问题的各种问题，但是我使用NgModu
2回复

如何基于Angular组件变量的值有条件地设置输入标签的最大值

我有3路输入控制定义如下 我想使用组件类变量的值动态设置2到1的范围，它不起作用
1回复

显示Firebase函数的返回值

做了更多阅读，更多编辑，现在我认为我的主要问题是当我在calculator.component.ts调用我的函数时再次我的 html 看起来是这样（从上次稍微编辑过）： 应用程序组件.html 计算器.component.html 计算器.component.ts 最后，我的firebase函数in