Prevent AngularJS to remove spaces

Question

How to prevent AngularJS to remove spaces when I do an interpolation?

What angularJS does:

{{"1 / 1"}} => 1/1

What I want:

{{"1 / 1"}} => 1 / 1

Thank you for your help.

`{{"1 / 1"}} => 1/1` not when I try it... multiple spaces will collapse to a single space, as with any html string, but but it doesn't collapse to a spaceless "1/1" — Daniel Beck, Oct 22 '15 at 18:10

PSL · Accepted Answer · 2015-10-22T18:13:36.207

Prevent AngularJS to remove spaces

It is not angular, it is the browser that formats to not display the extra whitespace (except that it keeps just one space) while displaying the content. You can use pre tag to wrap the content or use css white-space:pre to preserve the white spaces.

.preserve-ws {
  white-space: pre;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>

  <div>{{"1    /    1"}}</div>
  <pre>{{"1    /    1"}}</pre>
  <div class="preserve-ws">{{"1    /    1"}}</div>

</div>

Note: Though the answer is focused on the specific question title, the example in the question does not correctly reflect what is being asked.

Prevent AngularJS to remove spaces

1 Answers1