Форматирование веб-API с привязкой Angular

Из моего веб-API я вижу, что есть форматирование для разрывов строк и т. д., Как показано ниже:

address: "11 Ingle Park Way↵LONDON↵NN15 1GN↵United Kingdom"

Я хочу знать, как связать данные с моим представлением с помощью этого форматирования. Пока делаю:

<span class = "text-gray">{{receivedRequest.address}}</span>

TS-файл

receivedRequest: any;

constructor(private service: nowService,
    private appComponent: AppComponent,
    private userService: UserService,
    private router: Router,
    private http: HttpClient,
    private route: ActivatedRoute
  ) {
    this.receivedRequest = { number: '', opened_at: '', description: '', short_description: '', "c_i.serial_number" : "value" }; this.receivedLocation = { city: null, country: null }
  }

private getRequest() {
    this.service.getServiceRequest(this.s_id, this.c_id).subscribe((data) => {
      this.loading = true;
      console.info('Result - ', data);
      console.info('service data is received');
      this.loading = true;
      this.receivedRequest = data.result;
      this.loading = false;
    })
  }

.сервисный файл

getServiceRequest(s_id, cId): Observable<any> {
    return this.http.get<any>(this.servicenowApiUrl + "/" + s_id + "?c_id = " + cId)
      .pipe(
        catchError(this.handleError)
      );
  }

Вам нужно заменить разрывы текстовых строк фактическими элементами <br>, иначе они будут отображаться в одиночные пробелы, как практически все другие пробелы в HTML.

jonrsharpe 10.04.2019 17:54

хорошо, но нужна ли для этого дополнительная реализация во внешнем интерфейсе?

Sole 10.04.2019 17:55

Если вы не хотите делать это на стороне сервера, но это, вероятно, сделает его менее полезным для любых клиентов, не основанных на HTML.

jonrsharpe 10.04.2019 17:56

Так что все нужно сначала изменить на стороне API, верно?

Sole 10.04.2019 17:59

Нет, я говорю, что вы, вероятно, не должен делаете это на стороне сервера.

jonrsharpe 10.04.2019 18:00

Итак, если это поступает из API, как мне добавить теги <br>, поскольку эти данные поступают как один элемент, т.е. address

Sole 10.04.2019 18:02

Почему не пре-тег?

alessandro 10.04.2019 18:05

@Алессандро каким образом и как? можешь уточнить?

Sole 10.04.2019 18:08

Попробуйте заменить тег span на тег pre

alessandro 10.04.2019 18:09

Это сработало, Алессандро, можете ли вы добавить в качестве ответа, и я могу принять

Sole 10.04.2019 18:13
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
0
10
47
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Как вы можете прочитать здесь

The HTML pre element represents preformatted text which is to be presented exactly as written in the HTML file. The text is typically rendered using a non-proportional ("monospace") font. Whitespace inside this element is displayed as written.

Как вы можете найти ниже, вы можете заменить свой тег span на тег pre.

<pre class = "text-gray">{{receivedRequest.address}}</pre>

и сохраните существующий формат вашего текста без изменения конечной точки API.

Всего наилучшего

Другие вопросы по теме