{"id":754,"date":"2016-05-13T18:48:08","date_gmt":"2016-05-13T18:48:08","guid":{"rendered":"http:\/\/box.jharaphula.com\/?p=754"},"modified":"2024-01-25T04:21:08","modified_gmt":"2024-01-25T09:51:08","slug":"example-angularjs-dynamic-tabs-bootstrap","status":"publish","type":"post","link":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/","title":{"rendered":"Example of responsive AngularJS Dynamic Tabs using BootStrap 5"},"content":{"rendered":"

During web application development many times we required to implement dynamic tab for better user experience. In this example I am sharing the codes to create AngularJS Dynamic Tabs using BootStrap<\/a>. Here to show you a demo I created 4 states of India as the tabs. Under each tab I am showing the cities for that for that particular state dynamically.<\/p>\n

AngularJS directive<\/h2>\n

The AngularJS directive<\/a> here I create for my tab control is ngTab. Which accepts two parameters length & data<\/strong>. Length is the number of tabs we required. When data is the states & it’s cities. Data is in JSON format. You can replace this data as per your requirements. To get these parameters values in AngularJS ngTab directive I am using scope: { “length”: ‘=’, “data”: ‘@’ }<\/strong>. You can watch this in the below app.js file. To create responsive Tabs I used BootStrap here. my-tab.html is my template for ngTab. In template file I am binding the state & cities values (In form of array) from the scope object of TabModule.<\/p>\n

To run this demo application you need to create 3 files as index.html, app.js & my-tab.html. Copy the below codes to the respective files. With internet connection run the index.html. It will show you the result like the below screen.<\/p>\n

\"tab\"<\/p>\n

AngularJS Dynamic Tabs using BootStrap<\/h3>\n
<!DOCTYPE html>\r\n<html ng-app="tabModule">\r\n<head>\r\n<meta charset="utf-8">\r\n<title>Example to Create responsive AngularJS Dynamic Tabs<\/title>\r\n<!--AngularJS library CDN link-->\r\n<script type="text\/javascript" src="https:\/\/ajax.googleapis.com\/ajax\/libs\/angularjs\/1.3.0-rc.0\/angular.min.js"><\/script>\r\n<script type="text\/javascript" src="app.js"><\/script>\r\n<!--Jquery library CDN link-->\r\n<script src="http:\/\/code.jquery.com\/jquery-1.11.0.min.js"><\/script>\r\n<!--Jquery UI CDN link-->\r\n<script src="http:\/\/code.jquery.com\/ui\/1.11.1\/jquery-ui.js"><\/script>\r\n<!--BootStrap CDN links-->\r\n<script type="text\/javascript" src="http:\/\/netdna.bootstrapcdn.com\/twitter-bootstrap\/2.1.1\/js\/bootstrap.js"><\/script>\r\n<link href="http:\/\/netdna.bootstrapcdn.com\/twitter-bootstrap\/2.1.1\/css\/bootstrap.no-icons.min.css" rel="stylesheet">\r\n<link href="http:\/\/netdna.bootstrapcdn.com\/font-awesome\/2.0\/css\/font-awesome.css" rel="stylesheet">\r\n<link rel="stylesheet" href="http:\/\/netdna.bootstrapcdn.com\/twitter-bootstrap\/2.1.1\/css\/bootstrap.min.css" type="text\/css">\r\n<link rel="stylesheet" href="http:\/\/netdna.bootstrapcdn.com\/twitter-bootstrap\/2.1.1\/css\/bootstrap-theme.min.css" type="text\/css">\r\n<link rel="stylesheet" href="http:\/\/code.jquery.com\/ui\/1.11.1\/themes\/smoothness\/jquery-ui.css">\r\n<\/head>\r\n<body>\r\n<ng-tab length="4" data='{"Country":[{"state":"Maharashtra", "cities":"Mumbai, Pune, Nagpur, Thane, Nashik"},{"state":"Odisha", "cities":"Bhubaneswar, Cuttack, Rourkela, Brahmapur, Sambalpur"},{"state":"Karnataka", "cities":"Bellary, Bidar, Gulbarga, Koppal, Raichur"},{"state":"Chandigarh", "cities":"Ludhiana, Amritsar, Jalandhar, Patiala, Bathinda"}]}'><\/ng-tab>\r\n<\/body>\r\n<\/html><\/pre>\n
my-tab.htm<\/h3>\n
<!--ngTab Template-->\r\n<h3><center>{{ appDetails }}<\/center><\/h3>\r\n<div class="container">\r\n<div id="content">\r\n<ul id="tabs" class="nav nav-tabs" data-tabs="tabs">\r\n<li ng-class="{active: $first}" ng-repeat="item in tempArrTab">\r\n<a href="#{{ item }}" data-toggle="tab">{{ item }}<\/a>\r\n<\/li>\r\n<\/ul>\r\n<div id="my-tab-content" class="tab-content">\r\n<div ng-repeat="item in tempArrTab" class="tab-pane" ng-class="{active: $first}" id="{{ item }}">\r\n<h2>{{ item }}<\/h2>\r\n<p>Welcome to {{ item }}. Visit Us.<\/p>\r\nCities : <input list="tags-{{ $index }}">\r\n<\/div>\r\n\r\n<div ng-repeat="compitem in tempCompArr">\r\n<datalist id="tags-{{ $index }}">\r\n<option ng-repeat="items in compitem.split(',')" value="{{ items }}">\r\n<\/datalist>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div><\/pre>\n
app.js<\/h3>\n
\/* ng-tab Module *\/\r\nangular.module('tabModule', []).directive('ngTab', function() {\r\nreturn {\r\nrestrict: 'E',\r\ntransclude: true,\r\n\r\nscope: {\r\n\/* Accepting the number of Tab you want in your app *\/\r\n"length": '=',\r\n\/* Accepting the data in JSON for Tab *\/\r\n"data": '@'\r\n},\r\n\r\nlink: function (scope, element) {\r\nscope.$watch("length", function (arrlen) {\r\nscope.$watch("data", function (value) {\r\n\r\nvar obj = JSON.parse(value);\r\n\r\nvar lenjson = obj.Country.length;\r\n\r\nvar arrTab = [];\r\nvar autoCompArray = [];\r\n\r\n\/* Assigning input JSON data to Array *\/\r\nif (arrlen == lenjson) {\r\nfor(i=0; i<lenjson; i++) {\r\narrTab.push(obj.Country[i].state);\r\nautoCompArray.push(obj.Country[i].cities)\r\n}\r\n} else {\r\nalert('Please provide accurate data length.');\r\n}\r\n\r\nscope.tempArrTab = arrTab;\r\nscope.tempCompArr = autoCompArray;\r\nscope.appDetails = 'Create your own ng-tab using AngularJS';\r\n\r\n}, false);\r\n\r\n}, false);\r\n},\r\n\r\ncontroller: function($scope, $filter) {\r\n\r\n$(function() {\r\n$("#tabs").tabs();\r\n});\r\n},\r\ntemplateUrl: 'my-tab.htm'\r\n};\r\n});<\/pre>\n","protected":false},"excerpt":{"rendered":"
During web application development many times we required to implement dynamic tab for better user experience. In this example I am sharing the codes to…<\/p>\n","protected":false},"author":2,"featured_media":3079,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[27],"tags":[37178,37180,37179],"class_list":["post-754","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-learn-angularjs-with-examples","tag-angularjs-dynamic-tabs","tag-bootstrap","tag-dynamic-tabs-using-bootstrap"],"yoast_head":"\nExample of responsive AngularJS Dynamic Tabs using BootStrap 5<\/title>\n<meta name=\"description\" content=\"During web application development many times we required to implement AngularJS Dynamic Tabs for better user experience. Loo at the example how I did.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Example of responsive AngularJS Dynamic Tabs using BootStrap 5\" \/>\n<meta property=\"og:description\" content=\"During web application development many times we required to implement AngularJS Dynamic Tabs for better user experience. Loo at the example how I did.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/\" \/>\n<meta property=\"og:site_name\" content=\"OneStop Shop\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/tajinweb\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/panda.biswabhusan\" \/>\n<meta property=\"article:published_time\" content=\"2016-05-13T18:48:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-01-25T09:51:08+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png\" \/>\n\t<meta property=\"og:image:width\" content=\"750\" \/>\n\t<meta property=\"og:image:height\" content=\"487\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Biswabhusan Panda\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Biswabhusan Panda\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/\"},\"author\":{\"name\":\"Biswabhusan Panda\",\"@id\":\"https:\/\/jharaphula.com\/#\/schema\/person\/6e9804d6e96ca7218bf968283d69c01b\"},\"headline\":\"Example of responsive AngularJS Dynamic Tabs using BootStrap 5\",\"datePublished\":\"2016-05-13T18:48:08+00:00\",\"dateModified\":\"2024-01-25T09:51:08+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/\"},\"wordCount\":921,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/jharaphula.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png\",\"keywords\":[\"AngularJS Dynamic Tabs\",\"BootStrap\",\"Dynamic Tabs using BootStrap\"],\"articleSection\":[\"AngularJS with Examples\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/\",\"url\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/\",\"name\":\"Example of responsive AngularJS Dynamic Tabs using BootStrap 5\",\"isPartOf\":{\"@id\":\"https:\/\/jharaphula.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png\",\"datePublished\":\"2016-05-13T18:48:08+00:00\",\"dateModified\":\"2024-01-25T09:51:08+00:00\",\"description\":\"During web application development many times we required to implement AngularJS Dynamic Tabs for better user experience. Loo at the example how I did.\",\"breadcrumb\":{\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage\",\"url\":\"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png\",\"contentUrl\":\"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png\",\"width\":750,\"height\":487,\"caption\":\"Example to Create responsive AngularJS Dynamic Tabs using BootStrap\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jharaphula.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Example of responsive AngularJS Dynamic Tabs using BootStrap 5\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jharaphula.com\/#website\",\"url\":\"https:\/\/jharaphula.com\/\",\"name\":\"OneStop Shop\",\"description\":\"Blog for SEO Guest Posting, Digital Marketing or Home Remedies\",\"publisher\":{\"@id\":\"https:\/\/jharaphula.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jharaphula.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jharaphula.com\/#organization\",\"name\":\"OneStop Shop\",\"url\":\"https:\/\/jharaphula.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jharaphula.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/jharaphula.com\/wp-content\/uploads\/2023\/10\/logo.jpg\",\"contentUrl\":\"https:\/\/jharaphula.com\/wp-content\/uploads\/2023\/10\/logo.jpg\",\"width\":409,\"height\":91,\"caption\":\"OneStop Shop\"},\"image\":{\"@id\":\"https:\/\/jharaphula.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/tajinweb\",\"https:\/\/x.com\/guestpostingopp\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/jharaphula.com\/#\/schema\/person\/6e9804d6e96ca7218bf968283d69c01b\",\"name\":\"Biswabhusan Panda\",\"description\":\"Biswabhusan is the founder & CEO of JHARAPHULA. Over the last 3 years, he & his team has proved the way to turn blogging into a lucrative career choice. A blog scientist by mind and a passionate blogger by heart. His blog, JHARAPHULA is a platform of various interactive information.\",\"sameAs\":[\"https:\/\/jharaphula.com\",\"https:\/\/www.facebook.com\/panda.biswabhusan\"],\"url\":\"https:\/\/jharaphula.com\/author\/biswabhusan\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Example of responsive AngularJS Dynamic Tabs using BootStrap 5","description":"During web application development many times we required to implement AngularJS Dynamic Tabs for better user experience. Loo at the example how I did.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/","og_locale":"en_US","og_type":"article","og_title":"Example of responsive AngularJS Dynamic Tabs using BootStrap 5","og_description":"During web application development many times we required to implement AngularJS Dynamic Tabs for better user experience. Loo at the example how I did.","og_url":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/","og_site_name":"OneStop Shop","article_publisher":"https:\/\/www.facebook.com\/tajinweb","article_author":"https:\/\/www.facebook.com\/panda.biswabhusan","article_published_time":"2016-05-13T18:48:08+00:00","article_modified_time":"2024-01-25T09:51:08+00:00","og_image":[{"width":750,"height":487,"url":"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png","type":"image\/png"}],"author":"Biswabhusan Panda","twitter_misc":{"Written by":"Biswabhusan Panda","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#article","isPartOf":{"@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/"},"author":{"name":"Biswabhusan Panda","@id":"https:\/\/jharaphula.com\/#\/schema\/person\/6e9804d6e96ca7218bf968283d69c01b"},"headline":"Example of responsive AngularJS Dynamic Tabs using BootStrap 5","datePublished":"2016-05-13T18:48:08+00:00","dateModified":"2024-01-25T09:51:08+00:00","mainEntityOfPage":{"@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/"},"wordCount":921,"commentCount":0,"publisher":{"@id":"https:\/\/jharaphula.com\/#organization"},"image":{"@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage"},"thumbnailUrl":"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png","keywords":["AngularJS Dynamic Tabs","BootStrap","Dynamic Tabs using BootStrap"],"articleSection":["AngularJS with Examples"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/","url":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/","name":"Example of responsive AngularJS Dynamic Tabs using BootStrap 5","isPartOf":{"@id":"https:\/\/jharaphula.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage"},"image":{"@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage"},"thumbnailUrl":"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png","datePublished":"2016-05-13T18:48:08+00:00","dateModified":"2024-01-25T09:51:08+00:00","description":"During web application development many times we required to implement AngularJS Dynamic Tabs for better user experience. Loo at the example how I did.","breadcrumb":{"@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#primaryimage","url":"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png","contentUrl":"https:\/\/jharaphula.com\/wp-content\/uploads\/2016\/05\/tab-view.png","width":750,"height":487,"caption":"Example to Create responsive AngularJS Dynamic Tabs using BootStrap"},{"@type":"BreadcrumbList","@id":"https:\/\/jharaphula.com\/example-angularjs-dynamic-tabs-bootstrap\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jharaphula.com\/"},{"@type":"ListItem","position":2,"name":"Example of responsive AngularJS Dynamic Tabs using BootStrap 5"}]},{"@type":"WebSite","@id":"https:\/\/jharaphula.com\/#website","url":"https:\/\/jharaphula.com\/","name":"OneStop Shop","description":"Blog for SEO Guest Posting, Digital Marketing or Home Remedies","publisher":{"@id":"https:\/\/jharaphula.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jharaphula.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jharaphula.com\/#organization","name":"OneStop Shop","url":"https:\/\/jharaphula.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jharaphula.com\/#\/schema\/logo\/image\/","url":"https:\/\/jharaphula.com\/wp-content\/uploads\/2023\/10\/logo.jpg","contentUrl":"https:\/\/jharaphula.com\/wp-content\/uploads\/2023\/10\/logo.jpg","width":409,"height":91,"caption":"OneStop Shop"},"image":{"@id":"https:\/\/jharaphula.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/tajinweb","https:\/\/x.com\/guestpostingopp"]},{"@type":"Person","@id":"https:\/\/jharaphula.com\/#\/schema\/person\/6e9804d6e96ca7218bf968283d69c01b","name":"Biswabhusan Panda","description":"Biswabhusan is the founder & CEO of JHARAPHULA. Over the last 3 years, he & his team has proved the way to turn blogging into a lucrative career choice. A blog scientist by mind and a passionate blogger by heart. His blog, JHARAPHULA is a platform of various interactive information.","sameAs":["https:\/\/jharaphula.com","https:\/\/www.facebook.com\/panda.biswabhusan"],"url":"https:\/\/jharaphula.com\/author\/biswabhusan\/"}]}},"_links":{"self":[{"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/posts\/754","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/comments?post=754"}],"version-history":[{"count":0,"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/posts\/754\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/media\/3079"}],"wp:attachment":[{"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/media?parent=754"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/categories?post=754"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jharaphula.com\/wp-json\/wp\/v2\/tags?post=754"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}