polymer - Iroin-ajax response with html tags -
this question has answer here:
- how inject html template polymer 3 answers
i'm getting json feed iron-ajax, in returned json come html tags this.
[{ pk :1, body: "<p>ثم سكان بشرية الأبرياء عدد, كلّ يقوم الطرفين و. وبدأت انذار عل بحق, تكبّد إستيلاء الأثناء، دنو بـ, عالمية العالم، بالمطالبة قد الى. وزارة السبب التّحول فصل بل, كل والتي واشتدّت وايرلندا بعض. إحتار واندونيسيا، بلا لم, بوابة الفترة بين بل. </p> <p>ثم سكان بشرية الأبرياء عدد, كلّ يقوم الطرفين و. وبدأت انذار عل بحق, تكبّد إستيلاء الأثناء، دنو بـ, عالمية العالم، بالمطالبة قد الى. وزارة السبب التّحول فصل بل, كل والتي واشتدّت وايرلندا بعض. إحتار واندونيسيا، بلا لم, بوابة الفترة بين بل.".</p> <p>ثم سكان بشرية الأبرياء عدد, كلّ يقوم الطرفين و. وبدأت انذار عل بحق, تكبّد إستيلاء الأثناء، دنو بـ, عالمية العالم، بالمطالبة قد الى. وزارة السبب التّحول فصل بل, كل والتي واشتدّت وايرلندا بعض. إحتار واندونيسيا، بلا لم, "بوابة" الفترة بين بل.</p> <!-- images box --><div class="img_box01"> <img class="img-responsive" src="url" alt=""><p>عبد المالك نبيل بوتيجان</p> </div> <!-- video --><div class="box video_box"><div class="head"><h2></h2></div> <p>وأدرج بوتيجان على قائمة التطرف منذ 29 حزيران/يونيو لمحاولته التوجه إلى سوريا مرورا بتركيا، بحسب مصدر قريب من التحقيق.<br /> كما أن المنفذ الثاني يشبه إلى حد كبير مشتبها به تبحث عنه السلطات منذ 22 تموز/يوليو أي قبل ثلاثة أيام من الاعتداء الذي تم في كنيسة سانت اتيان دو روفريه بالقرب من روان (شمال غرب).</p> <p>وكان جهاز أجنبي أبلغ هيئة تنسيق مكافحة الإرهاب بوجود رجل لم تعرف هويته "مستعد للمشاركة في اعتداء على الأراضي الفرنسية"، وأرفقت بالبلاغ صورة لشخص يشبه كثيرا عبد المالك بوتيجان.</p> <!-- images box --><div class="img_box01"> <img class="img-responsive" src="url" alt=""><p>عبد المالك نبيل بوتيجان</p> </div> <!-- video --><div class="box video_box"><div class="head"><h2></h2></div><div class="content"><div class="arena"><video id="url" dir="ltr" class="video-js vjs-big-play-centered vjs-default-skin" controls preload="auto" width="600" height="338" poster=""><source src="url" type="video/mp4"></source><track kind="captions" src="" srclang="en" label="english"><track kind="captions" src="" srclang="ar" label="arabic" default><p class="vjs-no-js">to view video please enable javascript, , consider upgrading web browser</p></track></track></video></div></div><div class="foot"></div></div>", }]
so create dom-repeat element show results , when printing [[body]] , prints out text html tags text also, how print out html without facing xss security .
i think have insert html imperatively dom api (innerhtml
).
here's example in extend <div>
display arbitrary html.
polymer({ is: 'my-elem', properties: { ajaxresponse: { type: array, value: [{ pk :1, body: "<b>some html</b>" }] } } }); polymer({ is: 'my-div', extends: 'div', properties: { html: { type: string, observer: '_renderhtml' } }, _renderhtml: function(html) { this.innerhtml = html; } });
<!doctype html> <html> <head> <base href="https://polygit.org/components/"> <script src="webcomponentsjs/webcomponents-lite.min.js"></script> <script> polymer = { dom: 'shadow' } </script> <link href="polymer/polymer.html" rel="import"/> </head> <body> <my-elem></my-elem> <dom-module id="my-elem"> <template> <template id="repeater" is="dom-repeat" items="[[ajaxresponse]]"> <div is="my-div" html="[[item.body]]"></div> </template> </template> </dom-module> </body> </html>
note though possible security threat. sanitize input html inside <my-div>
element. example using sanitize-html
Comments
Post a Comment