Angular 如何在html指令中引用两个或多个角度模型属性，如[title]="；model.prop1-model.prop2“；

假设我的组件有一个模型类用户，该用户有用户名、昵称、名字和姓氏

export class User
{
    Username: string;
    Nickname: string;
    Firstname: string;
    Lastname: string;
    Email: string;
}

我希望html呈现如下内容：

<div [title]="user.Username - user.Nickname">
...
</div>

...

我试过上面的方法，但不起作用。如果它是一个值或内部Html，我知道如何使用它，但我希望类似于工具提示或标题属性

---

如何在不必在模型类中创建另一个属性的情况下执行该操作？现在，我想展示一个结合了两个模型道具的工具提示。为了得到这个，我错过了什么

您可以添加括号和字符串连接。试试下面的方法

...

或者，也可以使用数据插值

...

Wow！两者都有魅力。我所犯的错误是使用了第二个备选选项，即使用方括号的model指令语法。还有一个信息，虽然指令也使用相同的绑定语法，但如果将表达式

[target]=“expression”

称为而不是model指令语法，则会更清楚。