{"id":15455,"date":"2016-12-20T12:14:37","date_gmt":"2016-12-20T10:14:37","guid":{"rendered":"https:\/\/www.webcodegeeks.com\/?p=15455"},"modified":"2016-12-18T00:15:01","modified_gmt":"2016-12-17T22:15:01","slug":"angularjs-2-series-build-directive","status":"publish","type":"post","link":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/","title":{"rendered":"AngularJs 2 Series: Build Your Own Directive"},"content":{"rendered":"

Introduction<\/h2>\n

Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a directive. The selector is a HTML element or tag which can be placed in the HTML file to render your component. It also means we have a placed a directive to instruct HTML to render a component. Apart from being associated as HTML tags with components, directives also comes in two other forms: Attribute and Structural. Attributes are properties to HTML element or tag.
\n 
\nFor example: <input type=\"text\" ngClass=\"body-color\" \/><\/code> where type<\/code> is native HTML attribute and ngClass<\/code> is in-built Angular attribute. Structural directives are used when you want to change the structure of the HTML or DOM. For example: *ngIf<\/code> and *ngFor<\/code> are built-in Angular structural directives where *ngIf<\/code> conditionally alters the structure of DOM while *ngFor<\/code> modifies the DOM by adding elements using an iteration.<\/p>\n

In this article I will demonstrate the use of AngularJs 2 Directive feature. I will show you how to develop a custom attribute or property to an HTML element or tag which can then be associated to a component selector to render the desired output. We will use Angular CLI (Command Line Interface) to build the AngularJs 2 Directive. The article assumes that you have already setup AngularJs with CLI.
\n 
\nFor more information on setting up Angular CLI you can refer to Build Your Own Component<\/a> article.<\/p>\n

Creating Highlight Attribute Directive<\/h2>\n

We will create a highlight<\/em> attribute directive that will highlight the text background to yellow color. We will associate this attribute with the component that displays text. Open the Node.js command prompt, navigate to <your-project-home>\\src\\app<\/code> folder and run the following command:<\/p>\n

ng generate directive highlight<\/code><\/p>\n

The above command will create two files viz. hightlight.directive.spec.ts<\/em> and hightlight.directive.ts<\/em>. You can safely ignore the .spec.ts<\/em> file as this is for testing purpose. Let\u2019s look at the hightlight.directive.ts<\/em> file:<\/p>\n

import {Directive} from '@angular\/core';\r\n\r\n@Directive({\r\n  selector: '[highlight]'\r\n})\r\nexport class HighlightDirective {\r\n\r\n\tconstructor() {}\r\n}<\/pre>\n
The is our highlight directive class automatically named as HighlightDirective<\/code>. Lets understand the structure of the class. As you can see, the @Directive<\/code> decorator is used to indicate that this class is a directive and it has a single selector<\/code> meta-data. By default, the selector name generated is [appHighlight]<\/code> but we will change this to [highlight]<\/code>. It means we have created a highlight attribute directive and therefore it can be associated to a component displaying text that needs to be highlighted with yellow color.
\n 
\nWe will create a text component named TextComponent<\/code>. For more information on creating component refer to the Build Your Own Component<\/a> article.
\nSo lets assume you have created TextComponent<\/code> component class with the selector as <app-text><\/code> and the template file text.component.html<\/em>. Open the template file and add our newly created highlight attribute directive to the HTML snippet as shown below:<\/p>\n
<p highlight>\r\n  text works!\r\n<\/p><\/pre>\n
As you can see above, we have placed highlight<\/code> attribute to the HTML p<\/code> tag that will highlight the text.<\/p>\n
You have to put the selector <app-text><\/code> to render or display the text component. You will ideally put it in the bootstrap (starting) component of your application.<\/p><\/blockquote>\n
Upon running the Angular application, you will not see the highlight yellow background color yet. This is because we still have to provide the logic for styling the background color to yellow. Let\u2019s go back to our HighlightDirective<\/code> directive class and implement the highlight logic.<\/p>\n
import { Directive, ElementRef, Renderer } from '@angular\/core';\r\n\r\n@Directive({\r\n  selector: '[highlight]'\r\n})\r\nexport class HighlightDirective {\r\n\r\n\tconstructor(private elementRef: ElementRef, private renderer: Renderer) {\r\n\t\tthis.renderer.setElementStyle(this.elementRef.nativeElement, 'background-color', 'yellow');\r\n\t}\r\n\r\n}<\/pre>\n
As you can see from the above code, we make use of Renderer<\/code> service to render an element with the background style color as yellow. The element reference can be obtained using the instance of ElementRef<\/code> type. This is the element reference where you put your highlight<\/code> attribute. Now upon running the application, you should see the text with highlighted color as yellow.<\/p>\n
\n\n\n\n
Reference: <\/span><\/td>\nAngularJs 2 Series: Build Your Own Directive<\/a> from our WCG partner<\/a> Rajeev Hathi at the TECH ORGAN<\/a> blog.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
Introduction Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a directive. The selector is a HTML element or tag which can be placed in the HTML file to render your component. It also means we have a placed a directive to …<\/p>\n","protected":false},"author":91,"featured_media":909,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[25],"tags":[],"class_list":["post-15455","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-angular-js"],"yoast_head":"\nAngularJs 2 Series: Build Your Own Directive - Web Code Geeks - 2026<\/title>\n<meta name=\"description\" content=\"Introduction Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"AngularJs 2 Series: Build Your Own Directive - Web Code Geeks - 2026\" \/>\n<meta property=\"og:description\" content=\"Introduction Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Code Geeks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webcodegeeks\" \/>\n<meta property=\"article:published_time\" content=\"2016-12-20T10:14:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"150\" \/>\n\t<meta property=\"og:image:height\" content=\"150\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Rajeev Hathi\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:site\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Rajeev Hathi\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/\"},\"author\":{\"name\":\"Rajeev Hathi\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/a31899e91ce8c7e23aa3835a86bc749f\"},\"headline\":\"AngularJs 2 Series: Build Your Own Directive\",\"datePublished\":\"2016-12-20T10:14:37+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/\"},\"wordCount\":624,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg\",\"articleSection\":[\"Angular.js\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/\",\"name\":\"AngularJs 2 Series: Build Your Own Directive - Web Code Geeks - 2026\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg\",\"datePublished\":\"2016-12-20T10:14:37+00:00\",\"description\":\"Introduction Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a\",\"breadcrumb\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.webcodegeeks.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/javascript\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Angular.js\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/javascript\/angular-js\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"AngularJs 2 Series: Build Your Own Directive\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"name\":\"Web Code Geeks\",\"description\":\"Web Developers Resource Center\",\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.webcodegeeks.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\",\"name\":\"Exelixis Media P.C.\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"width\":864,\"height\":246,\"caption\":\"Exelixis Media P.C.\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webcodegeeks\",\"https:\/\/x.com\/webcodegeeks\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/a31899e91ce8c7e23aa3835a86bc749f\",\"name\":\"Rajeev Hathi\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7b3d1f5c751db08d0cecf939d205a54df4f1e8925989025e169b55425423fe40?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7b3d1f5c751db08d0cecf939d205a54df4f1e8925989025e169b55425423fe40?s=96&d=mm&r=g\",\"caption\":\"Rajeev Hathi\"},\"description\":\"Rajeev is a senior Java architect and developer. He has been designing and developing business applications for various companies (both product and services). He is co-author of the book titled 'Apache CXF Web Service Development' and shares his technical knowledge through his blog platform techorgan.com\",\"sameAs\":[\"http:\/\/techorgan.com\/\"],\"url\":\"https:\/\/www.webcodegeeks.com\/author\/rajeev-hathi\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"AngularJs 2 Series: Build Your Own Directive - Web Code Geeks - 2026","description":"Introduction Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a","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:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/","og_locale":"en_US","og_type":"article","og_title":"AngularJs 2 Series: Build Your Own Directive - Web Code Geeks - 2026","og_description":"Introduction Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a","og_url":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/","og_site_name":"Web Code Geeks","article_publisher":"https:\/\/www.facebook.com\/webcodegeeks","article_published_time":"2016-12-20T10:14:37+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg","type":"image\/jpeg"}],"author":"Rajeev Hathi","twitter_card":"summary_large_image","twitter_creator":"@webcodegeeks","twitter_site":"@webcodegeeks","twitter_misc":{"Written by":"Rajeev Hathi","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#article","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/"},"author":{"name":"Rajeev Hathi","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/a31899e91ce8c7e23aa3835a86bc749f"},"headline":"AngularJs 2 Series: Build Your Own Directive","datePublished":"2016-12-20T10:14:37+00:00","mainEntityOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/"},"wordCount":624,"commentCount":1,"publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg","articleSection":["Angular.js"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/","url":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/","name":"AngularJs 2 Series: Build Your Own Directive - Web Code Geeks - 2026","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg","datePublished":"2016-12-20T10:14:37+00:00","description":"Introduction Directives are simply instructions given in the form of HTML element, attribute or id. The selector meta data in the component is a","breadcrumb":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#primaryimage","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/angularjs-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.webcodegeeks.com\/javascript\/angular-js\/angularjs-2-series-build-directive\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.webcodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"JavaScript","item":"https:\/\/www.webcodegeeks.com\/category\/javascript\/"},{"@type":"ListItem","position":3,"name":"Angular.js","item":"https:\/\/www.webcodegeeks.com\/category\/javascript\/angular-js\/"},{"@type":"ListItem","position":4,"name":"AngularJs 2 Series: Build Your Own Directive"}]},{"@type":"WebSite","@id":"https:\/\/www.webcodegeeks.com\/#website","url":"https:\/\/www.webcodegeeks.com\/","name":"Web Code Geeks","description":"Web Developers Resource Center","publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.webcodegeeks.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.webcodegeeks.com\/#organization","name":"Exelixis Media P.C.","url":"https:\/\/www.webcodegeeks.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","width":864,"height":246,"caption":"Exelixis Media P.C."},"image":{"@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webcodegeeks","https:\/\/x.com\/webcodegeeks"]},{"@type":"Person","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/a31899e91ce8c7e23aa3835a86bc749f","name":"Rajeev Hathi","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7b3d1f5c751db08d0cecf939d205a54df4f1e8925989025e169b55425423fe40?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7b3d1f5c751db08d0cecf939d205a54df4f1e8925989025e169b55425423fe40?s=96&d=mm&r=g","caption":"Rajeev Hathi"},"description":"Rajeev is a senior Java architect and developer. He has been designing and developing business applications for various companies (both product and services). He is co-author of the book titled 'Apache CXF Web Service Development' and shares his technical knowledge through his blog platform techorgan.com","sameAs":["http:\/\/techorgan.com\/"],"url":"https:\/\/www.webcodegeeks.com\/author\/rajeev-hathi\/"}]}},"_links":{"self":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/15455","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/users\/91"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/comments?post=15455"}],"version-history":[{"count":0,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/15455\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media\/909"}],"wp:attachment":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media?parent=15455"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/categories?post=15455"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/tags?post=15455"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}