为啥不工作
Posted
技术标签:
【中文标题】为啥不工作【英文标题】：why is not working为什么不工作 【发布时间】：2018-02-23 16:52:12 【问题描述】：我想在名字和姓氏之间添加空格。但是当我运行代码时，它不会增加空间。我也尝试添加选项卡空间，但它没有正确渲染。字符集设置为 utf-8 可以在附加的 html 中看到
export class AppComponent implements OnInit
firstName: string;
lastName: string;
title: string;
clicked: boolean;
ngOnInit()
this.firstName = `John`;
this.lastName = `Doe`;
printDetails(frstnm: HTMLInputElement, lstnm: HTMLInputElement, event: any): void
this.firstName = frstnm.value || this.firstName;
this.lastName = lstnm.value || this.lastName;
this.title = `First Name is: $this.firstName Last Name is: $this.lastName`;
event.preventDefault();
this.clicked = true;
isVisible()
const classes =
display : this.clicked
return classes;
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>MyApp</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>【问题讨论】：
Angular 转义 html 实体。答：***.com/questions/31548311/angular-2-html-binding 如果你这样做\u00A0会有效吗？
@loganfsmyth 是的，它确实有效。为什么？
@SONGSTER 因为 \u00A0 不是 HTML 实体
这是什么？能否请您提供更多详细信息
【参考方案1】：
在标题中使用 HTML 没有意义。如果您想使用&nbsp;，那么您必须将标题呈现为 HTML 才能正确呈现，但这也意味着如果用户的 name 中有任何 HTML，它将是问题。如果我使用FirstName: "a <b>name</b>" 注册您的网站，那么它将在空格旁边呈现为粗体。
您应该将其保留为普通文本，并在代码中放置一个实际的不间断空格字符，使用 JS unicode escapes，而不是 HTML 转义符，例如使用\u00A0
this.title = `First Name is: $this.firstName\u00A0\u00A0\u00A0Last Name is: $this.lastName`;
【讨论】：
【参考方案2】：我假设这是 Angular。
没有打印空格，因为&nbsp; 应该呈现为 HTML。
<div [innerHTML]="title"></div>
Plunker
【讨论】：
【参考方案3】：如果你只是像这样添加空格呢？
this.title = `First Name is: $this.firstName Last Name is: $this.lastName`;
（注意...firstName和Last...之间的空格）
【讨论】：
好的，我假设您将文本传递给模板中的innerHTML 属性（就像@Michael 提到的那样）。以上是关于为啥不工作的主要内容，如果未能解决你的问题，请参考以下文章
为啥 Haskell ghc 不工作，但 runghc 工作良好？