Menu
I want space added between firstname and lastname where are added. but when i run the code it doesnt adds space. I also tried adding tab sapce as well but its not rendering correctly. The character set is set to utf-8 as can be seen in the attached 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>
591
Using HTML in your title does not make sense. If you wanted to use then you'd have to render the title as HTML for it to render properly, but that also means if a user had any HTML in their name, it would be an issue. If I register for your site with FirstName: "a <b>name</b>" then it would render as bold alongside the spaces.
Instead you should leave it as normal text, and put an actual non-breaking space character in your code, using JS unicode escapes, instead of HTML escapes, e.g. use \u00A0
this.title = `First Name is: ${this.firstName}\u00A0\u00A0\u00A0Last Name is: ${this.lastName}`;
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
