D
D
Dmitry2016-03-03 20:34:24
Angular
Dmitry, 2016-03-03 20:34:24

How to convert json string data to html structure?

I continue to master the development of an Ionic application for my site. The json data has a string containing the table tags. How can I convert this string into an HTML table on the client side?
-------------------------------------------------- --------------------
Here is an example json build: "

<p><table id="tablepress-7" class="tablepress tablepress-id-7"><thead><tr class="row-1 odd">	<th class="column-1">Наименование платных медицинских услуг</th><th class="column-2">Граждане РБ (стоимость с учетом материалов)</th><th class="column-3">из них материалы</th></tr></thead><tbody class="row-hover"><tr class="row-2 even">	<td class="column-1">Оценка функционального состояния организма по характеристикам пульса методом пальпации</td><td class="column-2">26,100</td><td class="column-3">1,000</td></tr><tr class="row-3 odd">	<td class="column-1">Классическое иглоукалывание (акупунктура)</td><td class="column-2">84,500</td><td class="column-3">33,400</td></tr><tr class="row-4 even">	<td class="column-1">Поверхностное иглоукалывание</td><td class="column-2">61,300</td><td class="column-3">22,900</td></tr><tr class="row-5 odd">	<td class="column-1">Аурикулярная рефлексотерапия</td><td class="column-2">98,500</td><td class="column-3">21,800</td></tr><tr class="row-6 even">	<td class="column-1">Лазероакупунктура</td><td class="column-2">96,000</td><td class="column-3">19,300</td></tr></tbody></table><br /><table id="tablepress-8" class="tablepress tablepress-id-8"><thead><tr class="row-1 odd">	<th class="column-1">Наименование платных медицинских услуг</th><th class="column-2">Граждане РБ (стоимость с учетом материалов)</th><th class="column-3">из них материалы</th></tr></thead><tbody class="row-hover"><tr class="row-2 even">	<td class="column-1">Диадинамотерапия</td><td class="column-2">35600</td><td class="column-3">18800</td></tr><tr class="row-3 odd">	<td class="column-1">Амплипульстерапия</td><td class="column-2">35600</td><td class="column-3">18800</td></tr><tr class="row-4 even">	<td class="column-1">Дарсонвализация местная</td><td class="column-2">16800</td><td class="column-3"></td></tr><tr class="row-5 odd">	<td class="column-1">Лазеротерапия, магнитолазеротерапия чрескожная</td><td class="column-2">27500</td><td class="column-3">19100</td></tr><tr class="row-6 even">	<td class="column-1">Надвенное лазерное облучение, магнитолазерное облучение</td><td class="column-2">35900</td><td class="column-3">19100</td></tr><tr class="row-7 odd">	<td class="column-1">Ультразвуковая терапия</td><td class="column-2">36200</td><td class="column-3">19400</td></tr><tr class="row-8 even">	<td class="column-1">Ультрафонофорез</td><td class="column-2">35900</td><td class="column-3">19100</td></tr><tr class="row-9 odd">	<td class="column-1">Механический аппаратный массаж на массажной кушетке, массажном кресле с локальной термотерапией</td><td class="column-2">38600</td><td class="column-3">17600</td></tr><tr class="row-10 even">	<td class="column-1">Ванны жемчужные</td><td class="column-2">18600</td><td class="column-3">6000</td></tr></tbody></table><br /><table id="tablepress-9" class="tablepress tablepress-id-9"><thead><tr class="row-1 odd">	<th colspan="2" class="column-1">Расходные материалы</th><th class="column-3">Стоимость</th></tr></thead><tbody class="row-hover"><tr class="row-2 even">	<td colspan="2" class="column-1">Сбор №1 Тонизирующий</td><td class="column-3">3,500</td></tr><tr class="row-3 odd">	<td colspan="2" class="column-1">Сбор №2 Витаминный</td><td class="column-3">3,300</td></tr><tr class="row-4 even">	<td colspan="2" class="column-1">Сбор №3 Успокаивающий</td><td class="column-3">3,600</td></tr><tr class="row-5 odd">	<td colspan="2" class="column-1">Сбор №4 Желудочный</td><td class="column-3">1,800</td></tr><tr class="row-6 even">	<td colspan="2" class="column-1">Сбор №5 Желчегонный</td><td class="column-3">4,100</td></tr><tr class="row-7 odd">	<td colspan="2" class="column-1">Сбор №6 Почечный</td><td class="column-3">2,200</td></tr><tr class="row-8 even">	<td colspan="2" class="column-1">Сбор №7 При сахарном диабете</td><td class="column-3">1,700</td></tr><tr class="row-9 odd">	<td colspan="2" class="column-1">Сбор №8 При простуде</td><td class="column-3">2,700</td></tr></tbody></table></p>
". And you need to get this: prntscr.com/ab176f

Answer the question

In order to leave comments, you need to log in

2 answer(s)
M
Mikhail Beloshitsky, 2016-03-03
@mbeloshitsky

Do you mean a line like "<tr><td>row 1</td></tr><tr>..."?
Then it all comes down to the question of how to bind variables that contain HTML code . In short, you need to use the directive ng-bind-htmland pass your string through $sce.trustAsHtml(stroka). Keep in mind that rendering HTML in different places (in your case, these places are the server that gives the string with the label and the angular on the client) is not a good tone, which is why the angular developers in this case complicate your life.
PS example

O
opiumdom, 2016-03-03
@opiumdom

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question