Ashu Ashu - 1 year ago 76
Javascript Question

how to remove html tags from json output

This is my JSON data:

{"articleList":[{"menu_name":"Abdominal Crunch","introduction":"<ul>\n<li>Abdominal crunch is one of the most important and basic exercise that &nbsp;helps to strengthen the abdominal muscles and also helps to prevent lower back pain or strain.<\/li>\n<li>While doing abdominal crunch, please maintain a proper form in order to avoid injury. Also to avoid strain you must not bend your neck.<\/li>\n<li>Keep your movements slow, don&rsquo;t do so many crunches at once as it may cause injury, it applies to a famous saying &ldquo;Too much of everything is not good for nothing&rdquo;.<\/li>\n<li>Perform 10-15 repetitions with correct form for each rep.<\/li>\n<li>Main muscles targeted\n<ul>\n<li>rectus abdominis (front abdominal muscles)<\/li>\n<li>Obliques (side abdominals)<\/li>\n<\/ul>\n<\/li>\n<\/ul>","menu_icon":"abs-crunch21.png","menu_icon2":"abs-crunch31.png","menu_icon3":"abs-crunch4.png","menu_icon4":"noimg.jpg","id":"109","parent_id":"108"},{"menu_name":"Ball Crunch","introduction":"<ul>\n<li>While performing ball crunches, proper form is very important to avoid injury.<\/li>\n<li>If you do this exercise properly for 12 sets, you can feel affect in your abdominal muscles.<\/li>\n<li>If you have neck problem, then you must perform it very slowly and carefully.<\/li>\n<li>Keep a bigger size ball for preforming this excercise.<\/li>\n<li>Targeted Muscles\n<ul>\n<li>Rectus Abdominis<\/li>\n<li>Other info:\n<ul>\n<li>Level type: Beginner<\/li>\n<li>Mechanics type: Isolation<\/li>\n<li>Force type: pull<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>","menu_icon":"ball-crunch11.png","menu_icon2":"ball-crunch21.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"110","parent_id":"108"},{"menu_name":"Ball Pass","introduction":"<ul>\n<li>Ball pass exercise is an effective exercise to improve your posture and to get a perfect six pack for you<\/li>\n<li>Main Muscles Targeted<br \/>\n<ul>\n<li>Deep abdominal muscles&nbsp;<\/li>\n<li>&nbsp;Internal and external oblique&rsquo;s<\/li>\n<\/ul>\n<\/li>\n<\/ul>","menu_icon":"ballpass1.png","menu_icon2":"ballpass2.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"111","parent_id":"108"},{"menu_name":"Leg Raise","introduction":"<ul>\n<li>Leg raise is an easy and great exercise for strengthening your abdominal muscles. Do this exercise (Leg raise) regularly&nbsp;&nbsp; to get a good abs. This exercise can do many wonders for your major or minor muscles groups. If you do this exercise daily, you will get excellent results.<\/li>\n<li>You can use carpet or yoga mat to feel comfortable while doing this exercise. More better will be if you use a flat bench. But be sure to do this exercise properly and regularly.<\/li>\n<li>Keep your thighs perpendicular to your body while raised your legs towards celling.<\/li>\n<li>You can press your palm on the floor as medium of support for raising your legs. And also keep your lower back&nbsp;&nbsp; attached with the floor.<\/li>\n<li>People having lower back problems are not encouraged to perform this exercise.<\/li>\n<li>Main Muscles Targeted:\n<ul>\n<li>Rectus abdominis.<\/li>\n<li>Hip flexors<\/li>\n<li>Internal and external obliques.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<ul>\n<li>Additional main muscles<\/li>\n<\/ul>","menu_icon":"leg-raise11.png","menu_icon2":"leg-raise2.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"112","parent_id":"108"},{"menu_name":"Reverse Cunch","introduction":"<ul>\n<li>Reverse crunches gives strength to your front Abdominals muscle, this is an isolation mechanics type exercise for the beginner.<\/li>\n<li>Once your knees reaches to chest, just wait for two seconds and inhaling slowly move your legs back to the ceiling.<\/li>\n<li>Instead of bending your legs you may lift your legs straight to advance in this excercise<\/li>\n<li>Main muscles targeted:\n<ul>\n<li>Front abdominal or rectus abdominis&nbsp;<\/li>\n<\/ul>\n<\/li>\n<li>Additional muscles\n<ul>\n<li>Internal and external oblique&rsquo;s<\/li>\n<\/ul>\n<\/li>\n<\/ul>","menu_icon":"reversecrunch1.png","menu_icon2":"reversecrunch2.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"113","parent_id":"108"},{"menu_name":"Twist Crunch","introduction":"<ul>\n<li>\n<div>Twist crunches are easy way for strengthening stomach and creating<\/div>\n<div>flat abdominal muscles. The major reason for strengthening your abdominal<\/div>\n<div>muscles is to make your abdominal young.<\/div>\n<\/li>\n<li>\n<div>&nbsp;People with back pain can fold a towel and use it on their back. These type<\/div>\n<div>of exercise also keeps your back healthy and strength<\/div>\n<\/li>\n<li>\n<div>As a beginner, do it slowly and carefully. This exercise uses isolation mechanism,<\/div>\n<div>you can use &nbsp;&nbsp;&nbsp;cable to hold your legs, keep your elbows tight when performing this exercise.<\/div>\n<\/li>\n<\/ul>","menu_icon":"twist-crunch11.png","menu_icon2":"twist-crunch21.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"116","parent_id":"108"},{"menu_name":"Side Crunch","introduction":"<ul>\n<li>Complete 3 sets with 10-15 repetitions of this exercise. Once you feel that, you are able to complete 10-15 reps with ease, then make increment to the number of reps up to 20-25. At the beginning, you may feel temporary muscle failure.<\/li>\n<li>If you have neck problem, then you must perform &nbsp;&nbsp;slowly and carefully. Do not perform this exercise if you have back pain.<\/li>\n<li>Main muscles targeted:\n<ul>\n<li>&nbsp;Obliques &nbsp;&nbsp;<\/li>\n<\/ul>\n<\/li>\n<li>Synergists\n<ul>\n<li>Rectus abdominals<\/li>\n<\/ul>\n<\/li>\n<\/ul>","menu_icon":"side-crunch1.png","menu_icon2":"side-crunch2.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"117","parent_id":"108"},{"menu_name":"Body Weight Squat","introduction":"<ul>\n<li>Body weight squat is a great exercise which targets your abs, hips, legs &ndash;calves and thighs.<\/li>\n<li>During Body weight squat, your body automatically functions your abs, hips, legs muscles while getting up and down from the seated position.<\/li>\n<li>Helps to increase the flexibility in the ankle and in the hips area. Very soon, You will find effect in those area.<\/li>\n<\/ul>","menu_icon":"body-weight-squat.png","menu_icon2":"body-weight-squat2.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"164","parent_id":"108"},{"menu_name":"Sprinter Situp","introduction":"<ul>\n<li>Sprinter sit-ups is a wonderful use for improving your abs muscle.<\/li>\n<\/ul>","menu_icon":"sprinter-situp.png","menu_icon2":"sprinter-situp2.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"166","parent_id":"108"},{"menu_name":"Side plank","introduction":"<ul>\n<li>Side plank is a great exercise for your abdominal obliques and the whole core.<\/li>\n<li>Does not need any special equipment except a mat.<\/li>\n<\/ul>","menu_icon":"side-plank11.png","menu_icon2":"side-plank21.png","menu_icon3":"noimg.jpg","menu_icon4":"noimg.jpg","id":"189","parent_id":"108"}]}

From below code,; //this piece of code gives JSON data
How can i remove html tags from here itself so that it can be sent vai
$scope.test = a

app.controller('myCtrl', function($scope, $http) {
method : "GET",
url : ""
}).then(function mySucces(response) {
var; //this gives JSON data as shown above,
$scope.test = a
}, function myError(response) {
$scope.test = response.statusText;

I tried this
$scope.test = a.replace(/<\/?[^>]+>/gi, '')
but code stopped working

JSON data with HTML code which looks bad on UI
enter image description here

Answer Source

I think the problem, that you are trying to replace an object a instead of the introduction strings a[i].introduction that actually contain the needed info.

So, it can be replaced in this manner: $scope.test = toValidData(a);

function toValidData(data) {
  data.articleList.forEach(function(article) {
    article.introduction = String(article.introduction).replace(/<[^>]+>/gm, '');
  return data;