DimaLepel
@DimaLepel

Как преобразовать данные строки json в HTML-структуру?

Продолжаю осваивать разработку Ionic-приложения для своего сайта. В данных json есть строка, содержащая теги таблицы. Как преобразовать эту строку в HTML-таблицу на стороне клиента?
----------------------------------------------------------------------
Вот пример строи json: "
<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>
" . А нужно получить вот это: prntscr.com/ab176f
  • Вопрос задан
  • 257 просмотров
Пригласить эксперта
Ответы на вопрос 2
mbeloshitsky
@mbeloshitsky
Вебдев, систем оперейшонс, ж.д. автоматика
Вы имеете ввиду строку вида "<tr><td>row 1</td></tr><tr>..."?

Тогда все сводится к вопросу как биндить переменные, которые содержат HTML-код. Вкратце, вам нужно воспользоваться директивой ng-bind-html и передавать вашу строку через$sce.trustAsHtml(stroka). Имейте ввиду, что рендерить HTML в разных местах (в вашем случае эти места - сервер, который отдает строку с табличкой и ангуляр на клиенте) не очень хороший тон, именно поэтому разработчики ангуляра в данном случае усложняют вам жизнь.

PS пример
Ответ написан
Комментировать
@opiumdom
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы