AngularJS + Json: How to render html - javascript

(I know this question was asked many times, but I believe my setup is different and so a new question needed to be asked with a different scenario)
There are plenty of examples out there that shows how to Render HTML, but I can't seem to get this to work with any of the examples. I'd like to render html the {{aboutlongs[0].description}} (this has <br /> tags that I would like to render as html)
Here's the js:
App.controller('aboutLongCtrl', function ($scope, $http) {
$http.get('test_data/ar_org.json')
.then(function (res) {
$scope.aboutlongs = res.data.aboutlong;
});
});
the HTML:
<div class="background-white p20 reasons" ng-controller="aboutLongCtrl" >
<h6><b>About {{aboutlongs[0].name}}</b></h6>
<div class="reason-content" >
{{aboutlongs[0].description}}
</div>
</div>
Can anyone point me to the right direction?
The Json file:
"aboutlong": [{
"name": "Women's March",
"description": "The rhetoric of the past election cycle has insulted, demonized, and threatened many of us - immigrants of all statuses, Muslims and those of diverse religious faiths, people who identify as LGBTQIA, Native people, Black and Brown people, people with disabilities, survivors of sexual assault - and our communities are hurting and scared. We are confronted with the question of how to move forward in the face of national and international concern and fear.<br /><br />In the spirit of democracy and honoring the champions of human rights, dignity, and justice who have come before us, we join in diversity to show our presence in numbers too great to ignore. The Women's March on Washington will send a bold message to our new government on their first day in office, and to the world that women's rights are human rights. We stand together, recognizing that defending the most marginalized among us is defending all of us.<br /><br />We support the advocacy and resistance movements that reflect our multiple and intersecting identities. We call on all defenders of human rights to join us. This march is the first step towards unifying our communities, grounded in new relationships, to create change from the grassroots level up. We will not rest until women have parity and equity at all levels of leadership in society. We work peacefully while recognizing there is no true peace without justice and equity for all.<br /><br />Women's rights are human rights, regardless of a woman's race, ethnicity, religion, immigration status, sexual identity, gender expression, economic status, age or disability. We practice empathy with the intent to learn about the intersecting identities of each other. We will suspend our first judgement and do our best to lead without ego."
}]
Posts I've tried:
How to render a HTML tag from json value using angularJs
Angular.js How to render a HTML tag from json file
AngularJS : Insert HTML into view

if you want to render string to html i recommand to use $sce.trustAsHtml(html).
you can create a sample filter like this
.filter('trustHtml',function($sce){
return function(html){
return $sce.trustAsHtml(html)
}
})
call the filter like this inside ng-bind-html
<div class="reason-content" ng-bind-html="aboutlongs[0].description | trustHtml" ></div>
Demo
angular.module("app",[])
.controller("ctrl",function($scope){
$scope.aboutlongs = [{
"name": "Women's March",
"description": "The rhetoric of the past election cycle has insulted, demonized, and threatened many of us - immigrants of all statuses, Muslims and those of diverse religious faiths, people who identify as LGBTQIA, Native people, Black and Brown people, people with disabilities, survivors of sexual assault - and our communities are hurting and scared. We are confronted with the question of how to move forward in the face of national and international concern and fear.<br /><br />In the spirit of democracy and honoring the champions of human rights, dignity, and justice who have come before us, we join in diversity to show our presence in numbers too great to ignore. The Women's March on Washington will send a bold message to our new government on their first day in office, and to the world that women's rights are human rights. We stand together, recognizing that defending the most marginalized among us is defending all of us.<br /><br />We support the advocacy and resistance movements that reflect our multiple and intersecting identities. We call on all defenders of human rights to join us. This march is the first step towards unifying our communities, grounded in new relationships, to create change from the grassroots level up. We will not rest until women have parity and equity at all levels of leadership in society. We work peacefully while recognizing there is no true peace without justice and equity for all.<br /><br />Women's rights are human rights, regardless of a woman's race, ethnicity, religion, immigration status, sexual identity, gender expression, economic status, age or disability. We practice empathy with the intent to learn about the intersecting identities of each other. We will suspend our first judgement and do our best to lead without ego."
}]
})
.filter('trustHtml',function($sce){
return function(html){
return $sce.trustAsHtml(html)
}
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<div class="background-white p20 reasons" >
<h6><b>About {{aboutlongs[0].name}}</b></h6>
<div class="reason-content" ng-bind-html="aboutlongs[0].description | trustHtml" >
</div>
</div>
</div>

Have a look at this awesome article Angular Trust Filter
angular.module('myApp', [])
.controller('aboutLongCtrl', ['$scope', '$sce', function($scope, $sce) {
$scope.aboutlongs = [{
"name": "Women's March",
"description": $sce.trustAsHtml("The rhetoric of the past election cycle has insulted, demonized, and threatened many of us - immigrants of all statuses, Muslims and those of diverse religious faiths, people who identify as LGBTQIA, Native people, Black and Brown people, people with disabilities, survivors of sexual assault - and our communities are hurting and scared. We are confronted with the question of how to move forward in the face of national and international concern and fear.<br /><br />In the spirit of democracy and honoring the champions of human rights, dignity, and justice who have come before us, we join in diversity to show our presence in numbers too great to ignore. The Women's March on Washington will send a bold message to our new government on their first day in office, and to the world that women's rights are human rights. We stand together, recognizing that defending the most marginalized among us is defending all of us.<br /><br />We support the advocacy and resistance movements that reflect our multiple and intersecting identities. We call on all defenders of human rights to join us. This march is the first step towards unifying our communities, grounded in new relationships, to create change from the grassroots level up. We will not rest until women have parity and equity at all levels of leadership in society. We work peacefully while recognizing there is no true peace without justice and equity for all.<br /><br />Women's rights are human rights, regardless of a woman's race, ethnicity, religion, immigration status, sexual identity, gender expression, economic status, age or disability. We practice empathy with the intent to learn about the intersecting identities of each other. We will suspend our first judgement and do our best to lead without ego.")
}];
}])
;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" class="background-white p20 reasons" ng-controller="aboutLongCtrl" >
<h6><b>About {{aboutlongs[0].name}}</b></h6>
<div class="reason-content" ng-bind-html="aboutlongs[0].description">
</div>
</div>

Related

How to convert a twiiter link into an embedded tweet?

I am building a news website which gets data from an external server. The external server often sends me the links to particular tweets but I can't seem to find a way to convert them into an embedded tweet
(Please note stack overflow wont let me send shortened urls, therefore it is in quotations.)
The json that it sends me is like -
"Story": "ROME: Harry Kane scored twice as a buoyant England cruised through to the semi-finals of Euro 2020 with a one-sided 4-0 win over Ukraine in Rome on Saturday. Kane ended a worrying international scoring drought by netting in the 2-0 last-16 defeat of Germany in midweek and he put England ahead inside four minutes on a sweaty evening in the Italian capital. <strong>As it happened: Ukraine vs England</strong> Gareth Southgate's side then put this quarter-final tie out of sight with two more goals early in the second half, one from Harry Maguire before Kane netted again. Substitute Jordan Henderson got the fourth, and as Denmark lie in wait in the Wembley semi-final on Tuesday England will be confident of going on to reach a first ever European Championship final and even now claiming a first major international title since 1966. <p>�������������� England = semi-finalists ������#EURO2020 | #ENG https://twitter.com/EURO2020/status/1411427976047120387"</p>— UEFA EURO 2020 (#EURO2020) 1625346114000 The draw here was kind for them, with Ukraine surely as weak an opponent as they could hope to face in a quarter-final, a stage at which they have lost to the likes of Italy and Portugal in recent European Championships. However the statistics are impressive, with England having come through five games at this tournament all without conceding a goal. Some of their play in wide areas was outstanding, with Raheem Sterling and Jadon Sancho -- making his first start at the Euro -- too hot for Ukraine to handle. <p>⏰ RESULT ⏰What. A. Performance. �������������� Kane (2), Maguire & Henderson net in Rome as England reach EURO 2020 se… https://twitter.com/EURO2020/status/1411427976047120387"</p>— UEFA EURO 2020 (#EURO2020) 1625345627000 Kane, their captain, had gone close to eight hours without finding the net for his country but his opener here was his second in just eight minutes following the late strike that secured victory over Germany. Regardless of the opposition, their display at the Stadio Olimpico was a step-up in class in the final third to previous games at the Euro and they will be favourites at home against a Danish side who played their own quarter-final against the Czech Republic on Saturday in distant Baku. This will be the only match England play away from home in the competition and it marked quite a difference to their defeat of the Germans, which was watched by more than 40,000 supporters at Wembley, where coronavirus restrictions were eased. <p>�������������� Two-goal England hero Harry Kane takes the plaudits after inspiring the Three Lions in Rome ��#Heineken |… https://twitter.com/EURO2020/status/1411427976047120387"</p>— UEFA EURO 2020 (#EURO2020) 1625346478000 With Italy currently imposing a five-day quarantine on all arrivals from the United Kingdom, the number of England fans in Rome was limited to those already based in the European Union although they still made themselves heard in the crowd of under 12,000. They had plenty to celebrate, unlike their Ukrainian counterparts, as Andriy Shevchenko's team came up short in their bid to take the country to a first ever major tournament semi-final. They scraped out of their group and then edged 10-man Sweden in extra time in the last 16, and their chances of shocking England looked dead and buried when they fell behind early on. Sterling, who terrorised the Ukraine defence down the left, played in Kane who poked the ball past Georgiy Bushchan. Ukraine's giant striker Roman Yaremchuk forced a save from Jordan Pickford and a Declan Rice piledriver was kept out by Bushchan, with England looking comfortable. However Ukraine were a different proposition after injured defender Serhiy Kryvtsov was replaced by Dynamo Kiev winger Viktor Tsygankov in the 36th minute. They finished the first half strongly and more pessimistic England fans may have spent the interval reliving their exit from Euro 2016, when they lost to Iceland in the last 16 despite also having opened the scoring in the fourth minute. They need not have worried. England scored again less than a minute after the restart when a foul on Kane allowed Luke Shaw to deliver a free-kick from the left for Maguire to head in. Four minutes after that Sterling supplied the overlapping Shaw and he crossed for a rejuvenated Kane to head home. The Tottenham star nearly had his hat-trick, a stinging volley producing a fine save from Bushchan. From Mason Mount's resulting corner came the fourth goal, another header, this time from Henderson, the first of five substitutes sent on by Southgate who would have been thinking about the semi-final long before this quarter-final was officially over. ",
Edit: Based on the reply below this. Let me clarify My server sends me data in the form of json objects with strings in it. I pass this data using ejs tags to their appropriate location to get rendered. I am asking how can i convert every twitter url that winds up in my json object to an embedded tweet.
Edit: This is the json that i received from the server I can render that just fine on my webpage but i cant seem to find a way to convert the hyperlinks to embeded tweet
just add "https://publish.twitter.com/oembed?" before your url as mentioned here.
you can also customize the embedded tweet as described in the link.
the response would be something like
{
"url": "https://twitter.com/Interior/status/507185938620219395",
"author_name": "US Dept of Interior",
"author_url": "https://twitter.com/Interior",
"html": "<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Happy 50th anniversary to the Wilderness Act! Here's a great wilderness photo from #YosemiteNPS. #Wilderness50 pic.twitter.com/HMhbyTg18X</p>— US Dept of Interior (#Interior) September 3, 2014</blockquote>n<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>",
"width": 550,
"height": null,
"type": "rich",
"cache_age": "3153600000",
"provider_name": "Twitter",
"provider_url": "https://twitter.com",
"version": "1.0"
}
and you can use the html property as embed tweet.
I think this should work for you. Twitter provides an api for creating embed html from a tweet url.
const axios = require('axios');
const main = async () => {
const tweetURL = 'https://twitter.com/thejackbeyer/status/1411522480775204866?s=20';
try {
const response = await axios.get(`https://publish.twitter.com/oembed?url=${tweetURL}`);
console.log(response.data.html);
} catch (error) {
console.error(error);
}
}
main();

Javascript/Jquery - Remove all text content - except for the last 10 characters (or 3 words) - before an element

I would like to remove all content inside the <p class="content"> paragraph before the element, EXCEPT for the last 10 characters, and ideally add ... before the first character:
I have this:
<p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>
And I would like to end up with something like this (it can also by by word - 2 or 3 words before the <span class="highlight">
<p class="content">...med doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>
You can use split to identify the highlight tag and add it before remove the letters.
Create a var with total letter to rest after ...;
Check this example:
var el = document.querySelector('.content');
var amountLetterBeforeHighlight = 25;
var splitEl = el.innerHTML.split('<span class="highlight">')
el.innerHTML = '... :rest<span class="highlight">:splitRest '.replace(/\:rest/g, splitEl[0].substr(splitEl[0].length - amountLetterBeforeHighlight)).replace(/\:splitRest/g, splitEl[1])
.highlight {
color: blue
}
<p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>
EDIT:
So you want to create with multiples paragraphs, so check this out:
var els = document.querySelectorAll('.content');
var amountLetterBeforeHighlight = 25;
els.forEach(el => {
var splitEl = el.innerHTML.split('<span class="highlight">');
el.innerHTML = '... :rest<span class="highlight">:splitRest '.replace(/\:rest/g, splitEl[0].substr(splitEl[0].length - amountLetterBeforeHighlight)).replace(/\:splitRest/g, splitEl[1]);
});
.highlight {color: blue}
<p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>
<p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>
<p class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied. </p>
No matter what is inside, after the code find the highlight tag then apply to each el at time.
Hope this help!
See the example below, comments within code.
//get innerHTML of p
var p = document.getElementById("p").innerHTML;
//check length of p - uncomment below to see length
//console.log(p.length)
//length of p was 611 so we just want to get index 605 - 611 of p
var pslice = p.slice(605,611);
//declare new p for example by id "shortp"
var shortp = document.getElementById("shortp")
//set innerHTML of example "shortp" with ... + pslice
shortp.innerHTML = "..." + pslice
<p id="p" class="content">It sportsman earnestly ye preserved an on. Moment led family sooner cannot her window pulled any. Or raillery if improved landlord to speaking hastened differed he. Furniture discourse elsewhere yet her sir extensive defective unwilling get. Why resolution one motionless you him thoroughly. Noise is round to in it quick timed doors. <span class="highlight">loving</span> family. Born in Brewer, ME on August 21, 1934, she was the daughter of Able. Written address greatly get attacks inhabit pursuit our but. Lasted hunted enough an up seeing in lively letter. Had judgment out opinions property the supplied.</p>
<p><i>Your shortened example below</i></p>
<p id="shortp"></p>

How to remove html tags from json data in react native? [duplicate]

This question already has answers here:
How to strip HTML tags from string in JavaScript? [duplicate]
(4 answers)
Closed 5 years ago.
In my React Native app i'm fetching json data which contains raw html tags.How to remove the html tags from that?Following is the json response i'm getting
[{
"data": {
"course": {
"id": 2864,
"name": "2. Understanding India’s economic transition",
"date_created": 1506154480,
"status": "publish",
"price": false,
"price_html": "FREE",
"total_students": 0,
"seats": "",
"start_date": false,
"average_rating": 0,
"rating_count": 0,
"featured_image": "https://www.mywebsite.com/lms/wp-content/themes/wplms/assets/images/avatar.jpg",
"categories": [],
"instructor": {
"id": "22",
"name": "aami",
"avatar": "https://www.mywebsite.com/lms/wp-content/uploads/2017/11/favicon.png",
"sub": ""
},
"menu_order": 0
},
"description": "<p style=\"text-align: justify;\">India is undergoing an economic, social and technological transformation. Perhaps no other phase is going to be as critical as the present one in shaping the future of the country as well as determining the welfare of the people. The economic transition is the vital ingredient of these overall change. Faster growth accompanied by industrial sector expansion, skill addition to the people, creation of quality infrastructure etc. will fuel this growth phase.</p>\n<p style=\"text-align: justify;\">For understanding how important is the present development phase, we have to adopt a historical and comparative study. Following factors helps us to understand the present development phase of India.</p>\n\n<ol style=\"text-align: justify;\">\n \t<li><strong>Achievement of higher growth rate as a middle-income economy. </strong></li>\n</ol>\n<p style=\"text-align: justify;\">India at present is a lower middle-income economy and has to become a high-income economy undergoing a rapid growth phase extending at least three decades.</p>\n<p style=\"text-align: justify;\">Most important narrative about the Indian economy is that it is the third largest in the world in terms of Purchasing Power Parity GDP. But a superior way to asses a country’s development is to consider per capita income. The widely used ranking about countries’ economic position is that of the World Bank’s GDP Per capita (constant US $) and the data for 2016 shows that India’s per capita income is $1861 compared to China’s $ 6994.</p>\n<p style=\"text-align: justify;\">Table: Categorization of countries by World Bank</p>\n\n<table>\n<tbody>\n<tr>\n<td width=\"198\"><strong>Category</strong></td>\n<td width=\"318\"><strong>PCI as on 2015 in constant US Dollar</strong></td>\n</tr>\n<tr>\n<td width=\"198\">Low Income Economy</td>\n<td width=\"318\">$ 1025 or less</td>\n</tr>\n<tr>\n<td width=\"198\">Middle Income Economy\n\n(India - $ 1861)</td>\n<td width=\"318\">$1026 to $4035 (Lower Middle Income)\n\n$4036 to $12475 (Upper Middle Income)</td>\n</tr>\n<tr>\n<td width=\"198\">Higher Income Economy</td>\n<td width=\"318\">$ 12476 and above</td>\n</tr>\n</tbody>\n</table>\n<p style=\"text-align: justify;\">According to World Bank metrics, a country with less than $1045 is considered as low-income economy whereas one with a PCI of $12736 or higher is considered as a higher income economy. Higher income means higher standard of living. India is at the bottom of the lower middle-income economies and has to achieve higher economic growth, structural changes including industrialisation to raise per capita income near to the $12736 mark in the long run. This is what the country has to achieve through the transition.</p>\n\n<ol style=\"text-align: justify;\" start=\"2\">\n \t<li><strong> Industrial sector expansion</strong></li>\n</ol>\n<p style=\"text-align: justify;\">There are several factors that drives the economy to prosperity. Per capita income is just a monitored goal. How it can be raised is through achieving more productivity and employment generation in the sectors that can create big changes is decisive element for the country’s transition. Here comes the role of industrial sector. The industrial sector is known for generating huge employment with minimum skill addition. Similarly, no other sector has higher level of tradability as the industrial sector (means a country can earn big income through exports). Graduating to an expanded services sector without undergoing industrialisation will be self-defeating and unsuitable to a big economy like India. Depending on services sector for exports will not reward as other countries like to protect their services sector from the inflow of India’s skilled persons. If India can increase the contribution of the industrial sector in GDP from the present 30 per cent to say 40-45%, it implies that sizable income and employment are created in the sector.</p>\n\n<ol style=\"text-align: justify;\" start=\"3\">\n \t<li><strong> Skilling the people when demography favours.</strong></li>\n</ol>\n<p style=\"text-align: justify;\">India has the largest number of young people in the world besides having largest workforce age group population. This situation is expected to remain till 2045. Now, youth means higher ability to produce, consume and thus stimulate overall economic activities. As in the case of an individual, better things happen for an economy when it is young.</p>\n\n<ol style=\"text-align: justify;\" start=\"4\">\n \t<li><strong> Infrastructure generation.</strong></li>\n</ol>\n<p style=\"text-align: justify;\">Infrastructure is the platform for fueling growth. The government has launched several programmes to build quality infrastructure to assist economic transformation. In the industrial sector, there is the industrial corridor project; in transportation – there is the NHDP, PMGSY, Bhartamala, Sagarmala etc. Similarly, digital infrastructure is undergoing a qualitative improvement along with the education sector.</p>\n\n<ol style=\"text-align: justify;\" start=\"5\">\n \t<li><strong> Building invention and Innovation.</strong></li>\n</ol>\n<p style=\"text-align: justify;\">Development is dynamic and present day developing economies can’t achieve development with the strategy of the past. Fourth industrialisation, robotics, artificial intelligence etc., proved that industrialisation is not labour oriented. Here, Countries like China with the aid of superior technology with its sizable labour force can produce and supply goods to the entire world. Competing in the new age industrial sector need good technological adaptation and a progressive national invention and educational systems.</p>\n\n<ol style=\"text-align: justify;\" start=\"6\">\n \t<li><strong> Easing of Doing Business.</strong></li>\n</ol>\n<p style=\"text-align: justify;\">India’s business environment is historically suffocated by excess regulations and slow bureaucratic functions that are unsuitable for enterprise development.. But in recent years, institutional reforms are taking place and development blocking regulations are in the process of elimination.</p>\n<p style=\"text-align: justify;\">Development has become a major theme of the government and every issue related with economic prosperity are sophisticatedly addressed. Improvements in all the above field is slowly yielding results. Despite the adverse global slowdown and anti-globalisation headwinds, India continues to be the fastest growing large economy.</p>",
"curriculum": false,
"reviews": [],
"instructors": [{
"id": "22",
"name": "tojo",
"avatar": "https://www.mywebsite.com/lms/wp-content/uploads/2017/11/favicon.png",
"sub": "",
"average_rating": 0,
"student_count": 0,
"course_count": "0",
"bio": false
}],
"purchase_link": false
},
"headers": [],
"status": 200
}]
I'm listing description inside a card. So how to remove html tags?Please do help..Is there a way to do this?
What about this?
const regex = /(<([^>]+)>)/ig;
const result = data.description.replace(regex, '');
I also faced this challenge in my app.
After trying several library, i'd like to recommand you react-native-render-html
It allows you to provide 'html' to a Native component and have a simple text as an output.
You can also customize each tag to give them specific style or ignore some of them.
It does not require you to use 'react link' to make it work so you can use it in your expo app as well.
Hope it helps.

how to not select somedata using xpath in webharvest

I am using webharvest with xquery to get a data from a website.
I have the 2 xquery variables with the following data
$text:
<p> <strong>Psoria-Shield Inc.</strong> (www.psoria-shield.com) is a Tampa FL based company specializing in design, manufacturing, and distribution of medical devices to domestic and international
markets. PSI employs full-time engineering, production, sales staff, and manufactures within an ISO 13485 certified quality
system. PSI's flagship product, Psoria-Light®, is FDA-cleared and CE marked and delivers targeted UV phototherapy for
the treatment of certain skin disorders. Psoria-Shield Inc., was acquired by Wellness Center USA Inc. ("WCUI") in August 2012,
and is now a wholly-owned subsidiary.
</p>
<p> <strong>AminoFactory</strong> (www.aminofactory.com), a division of Wellness Center USA, Inc., is an online supplement store that markets and sells a wide range of high-quality
nutritional vitamins and supplements. By utilizing AminoFactory's online catalog, bodybuilders, athletes, and health conscious
consumers can choose and purchase the highest quality nutritional products from a wide array of offerings in just a few clicks.
</p>
<pre>At Wellness Center Usa, Inc.
Tel: (847) 925-1885 www.wellnescenterusa.com Investor Relations Contact:
Arthur Douglas & Associates, Inc.
Arthur Batson
Phone: 407-478-1120 www.arthurdouglasinc.com</pre> </span><span class="dt-green">
and $contact:
At Wellness Center Usa, Inc.
Tel: (847) 925-1885 www.wellnescenterusa.com Investor Relations Contact:
Arthur Douglas & Associates, Inc.
Arthur Batson
Phone: 407-478-1120 www.arthurdouglasinc.com
(This above text is just a example.)
What I want to so is remove the content of $contact from $text so far I have come up with the following code:
{
for $x in $text
return if(matches($contact, '')) then $x
else if(matches($contact, $x)) then '' else $x
}
It is not working. I dont know where I am going wrong. Please let me know the right way of doing this.
Do not use matches(...) for exact string comparison, it is made for regular expressions and you'd need to escape a bunch of special characters.
If the HTML subtree is the exact same, use this:
$text[not(deep-equal(., <pre>{ $contact }</pre>))]
If you only want to compare its contents, use data(...):
$text[not(data(.) = string-join(data($contact)))]
But given the data you posted, you'd be fine just removing all <pre/> nodes:
$text[local-name() != 'pre']

Javascript find a string in a multidimensional array and return that array?

I have an array like
var schedule = [
{date:'9/21/2011',mId:1,title:'Faith, Fraud and Minimum Wage',director:'George Mihalka',startTime:'9:20 PM',length:'91',genre:'Drama',movieType:'Faith, Fraud and Minimum Wage',trailer:'iVs5VL2kH8s',synopsis:'Halifax actor, dramatist and screenwriter Josh MacDonald’s hit play <i>Halo</i> has finally hit the big screen, courtesy of <i>My Bloody Valentine</i> director George Mihalka and legendary producer Colin Neale.\nA tragicomic tale of faith in a skeptical age, <i>Faith, Fraud and Minimum Wage</i> is based on real-life incidents in Nova Scotia that generated international headlines. In the economically depressed town of Nately, a young atheist maverick named Casey discovers the image of Jesus on the outside wall of her coffee-shop workplace. As outside interest builds and Nately finally makes it on the map, Casey’s own strained domestic situation boils to a climax.\nClever, moving and surprisingly respectful, <i>Faith, Fraud and Minimum Wage</i> features sparkling performances from the likes of Picnicface’s Andrew Bush (as the town priest), Callum Keith Rennie (as the dad) and Martha MacIsaac in the central role of Casey.',location:'Parklane',movieTime:'Fri, Sep 3, 7PM',moviePic:'../movies/faithfraudminimumwage/1.png'},
{date:'9/21/2011',mId:2,title:'Mind The Gap',director:'Aaron Au',startTime:'7:00 PM',length:'7',genre:'Drama',movieType:'CBC Atlantic Shorts Gala',trailer:'hbLgszfXTAY',synopsis:'Halifax actor, dramatist and screenwriter Josh MacDonald’s hit play <i>Halo</i> has finally hit the big screen, courtesy of <i>My Bloody Valentine</i> director George Mihalka and legendary producer Colin Neale.\nA tragicomic tale of faith in a skeptical age, <i>Faith, Fraud and Minimum Wage</i> is based on real-life incidents in Nova Scotia that generated international headlines. In the economically depressed town of Nately, a young atheist maverick named Casey discovers the image of Jesus on the outside wall of her coffee-shop workplace. As outside interest builds and Nately finally makes it on the map, Casey’s own strained domestic situation boils to a climax.\nClever, moving and surprisingly respectful, <i>Faith, Fraud and Minimum Wage</i> features sparkling performances from the likes of Picnicface’s Andrew Bush (as the town priest), Callum Keith Rennie (as the dad) and Martha MacIsaac in the central role of Casey.',location:'Oxford Theatre',movieTime:'Fri, Sep 8, 7PM',moviePic:'../movies/faithfraudminimumwage/1.png'},
{date:'9/24/2011',mId:2,title:'Mind The Gap',director:'Aaron Au',startTime:'7:00 PM',length:'7',genre:'Drama',movieType:'CBC Atlantic Shorts Gala',trailer:'hbLgszfXTAY',synopsis:'Halifax actor, dramatist and screenwriter Josh MacDonald’s hit play <i>Halo</i> has finally hit the big screen, courtesy of <i>My Bloody Valentine</i> director George Mihalka and legendary producer Colin Neale.\nA tragicomic tale of faith in a skeptical age, <i>Faith, Fraud and Minimum Wage</i> is based on real-life incidents in Nova Scotia that generated international headlines. In the economically depressed town of Nately, a young atheist maverick named Casey discovers the image of Jesus on the outside wall of her coffee-shop workplace. As outside interest builds and Nately finally makes it on the map, Casey’s own strained domestic situation boils to a climax.\nClever, moving and surprisingly respectful, <i>Faith, Fraud and Minimum Wage</i> features sparkling performances from the likes of Picnicface’s Andrew Bush (as the town priest), Callum Keith Rennie (as the dad) and Martha MacIsaac in the central role of Casey.',location:'Parklane',movieTime:'Fri, Sep 12, 7PM',moviePic:'../movies/faithfraudminimumwage/1.png'},
];
and I have a movie listing, and I want to see if the current movie listings mId is equal to any other mId's in the array schedule, if so return them in an array so I can loop through them and display the other results.
I am a bit confused with how to do this? I assumed you use array.filter but I can't seem to figure it out.
Any help?
array.filter should work. Try the following code:
var filtered = schedule.filter(function(val) {
return val['mId'] != searchMid;
});
where searchMid is the mid you are searching for.

Categories