{"id":2477,"date":"2016-06-17T12:08:18","date_gmt":"2016-06-17T10:08:18","guid":{"rendered":"https:\/\/www.angulararchitects.io\/?p=2477"},"modified":"2016-06-17T12:08:18","modified_gmt":"2016-06-17T10:08:18","slug":"mit-guards-ins-routing-des-angular-2-routers-eingreifen","status":"publish","type":"post","link":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/","title":{"rendered":"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen"},"content":{"rendered":"
\n
\n

Update in January 2017: This post has been updated to use the final API of Angular 2.x.\n<\/p><\/blockquote>\n

\nThe German version<\/a> of this article can be found here<\/a>.\n<\/p><\/blockquote>\n

Using Guards, Angular-Applications can get informed about changes to the current route by the new Angular-2-Router<\/a> that is available since June 2016. These Guards are just services. Their methods that are defined by interfaces are called by the router when it activates or deactivates a component. The returned value defines whether the router is allowed to perform the requested route-change. Valid values are true<\/code>, false<\/code> and Observable<boolean><\/code>. The latter one allows to postpone the decision so that the application can delegate to a service or talk to the user before making up its decision.<\/p>\n

For implementing guards, the router provides two interfaces: CanActivate<\/code> defines the method canActivate<\/code> that is executed by the router before activating a component. The interface CanDeactivate<\/code> in turn comes with a method canDeactivate<\/code> that is executed before deactivating a component. This article shows how an application can use canDeactivate<\/code> to ask the user for permission before leaving a component. The sourcecode for this sample<\/a> can be found here<\/a>.<\/p>\n

\"sample\"<\/a><\/p>\n

Implementing a Guards<\/h2>\n

The here presented guard is a simple Angular-2-Service that implements the interface CanDeactivate<\/code>. This interface has to be parametrised with the type of the component it is indented for:<\/p>\n

import { CanDeactivate, ActivatedRouteSnapshot, RouterStateSnapshot} from '@angular\/router';\nimport { FlightEditComponent} from '.\/flight-edit.component';\n\nexport class FlightEditGuard implements CanDeactivate<FlightEditComponent> {\n\n    canDeactivate(\n            component: FlightEditComponent, \n            route: ActivatedRouteSnapshot, \n            state: RouterStateSnapshot) {\n\n                return component.canDeactivate();\n    }\n\n}\n<\/code><\/pre>\n
Implementing the component<\/h2>\n
The method canDeactivate<\/code> takes the instance of the component in question as well as parameters that inform about the current and the requested future state of the router. The here described implementation delegates to the component so that it can display a warning for the user.<\/p>\n
The method canDeactivate<\/code> within the component which is called by the guard sets the property exitWarning.show<\/code> to true<\/code> to show the warning. This warning asks the user whether they really want to leave the route. As canDeactivate<\/code> has to wait for their decision it returns an Observable<boolean><\/code> and stores the equivalent  Observer<boolean><\/code> into exitWarning.observer<\/code>.<\/p>\n
The method decide<\/code> takes the decision from the user and hides the warning by setting exitWarning.show<\/code> back to false<\/code>. After that, it sends the received decision to the router by using the Overserver<\/code>.<\/p>\n
import { Component} from '@angular\/core';\nimport { ActivatedRoute} from '@angular\/router';\nimport { Observable, Observer} from 'rxjs';\n\n@Component({\n    template: require('.\/flight-edit.component.html')\n})\nexport class FlightEditComponent {\n\n    [...]    \n\n    exitWarning = {\n        observer: null,\n        show: false\n    }\n\n    decide(d: boolean) {\n        this.exitWarning.show = false;\n        this.exitWarning.observer.next(d);\n        this.exitWarning.observer.complete();\n    }\n\n    canDeactivate() {\n        this.exitWarning.show = true;\n        return new Observable<boolean>((sender: Observer<boolean>) => {\n            this.exitWarning.observer = sender;\n\n        });\n    }\n\n}\n<\/code><\/pre>\n
The template for the warning can be found in the next listing. It shows the warning in lieu of exitWarning.show<\/code>. The descion of the user is delegated to the method decide<\/code>.<\/p>\n
<div *ngIf=\"exitWarning.show\" class=\"alert alert-warning\">\n        <div>\n        Daten wurden nicht gespeichert! Trotzdem Maske verlassen?\n        <\/div>\n        <div>\n            <a href=\"javascript:void(0)\" (click)=\"decide(true)\" class=\"btn btn-danger\">Ja<\/a>\n            <a href=\"javascript:void(0)\" (click)=\"decide(false)\" class=\"btn btn-default\">Nein<\/a>\n        <\/div>\n<\/div>\n<\/code><\/pre>\n
Registering guard within the router-configuration<\/h2>\n
To register the guard for a component, its entry within the router-configuration has to point to it via the array canDeactivate<\/code>:<\/p>\n
const APP_ROUTES: RouterConfig = [\n    {\n        path: '\/home',\n        component: HomeComponent,\n        index: true\n    },\n    {\n        path: '\/flight-booking',\n        component: FlightBookingComponent,\n        children: [\n            {\n                path: '\/flight-search',\n                component: FlightSearchComponent\n            },\n            {\n                path: '\/passenger-search',\n                component: PassengerSearchComponent\n            },\n            {\n                path: '\/flight-edit\/:id',\n                component: FlightEditComponent,\n                canDeactivate: [FlightEditGuard]\n            }\n        ]\n    }\n];\n<\/code><\/pre>\n
Strictly speaking, canDeactivate<\/code> only points to a token which has to be bound to a service with a provider. The following listing creates a such a provider using the usual abbreviated form:<\/p>\n
import { OAuthModule } from 'angular-oauth2-oidc';\n\n[...]\n\n@NgModule({\n  imports: [\n    BrowserModule,\n    FormsModule,\n    HttpModule,\n    [...]\n  ],\n  providers: [\n    FlightEditGuard\n  ]\n  [...]\n})\nexport class AppModule {\n}\n<\/code><\/pre>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
Mit Guards Ins Routing Des Angular-2-Routers Eingreifen<\/p>\n","protected":false},"author":9,"featured_media":2997,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_price":"","_stock":"","_tribe_ticket_header":"","_tribe_default_ticket_provider":"","_ticket_start_date":"","_ticket_end_date":"","_tribe_ticket_show_description":"","_tribe_ticket_show_not_going":false,"_tribe_ticket_use_global_stock":"","_tribe_ticket_global_stock_level":"","_global_stock_mode":"","_global_stock_cap":"","_tribe_rsvp_for_event":"","_tribe_ticket_going_count":"","_tribe_ticket_not_going_count":"","_tribe_tickets_list":"[]","_tribe_ticket_has_attendee_info_fields":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2477","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-unkategorisiert"],"acf":[],"yoast_head":"\nMit Guards Ins Routing Des Angular-2-Routers Eingreifen - ANGULARarchitects<\/title>\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.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen - ANGULARarchitects\" \/>\n<meta property=\"og:description\" content=\"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/\" \/>\n<meta property=\"og:site_name\" content=\"ANGULARarchitects\" \/>\n<meta property=\"article:published_time\" content=\"2016-06-17T10:08:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"853\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Manfred Steyer, GDE\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@daniel\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Manfred Steyer, GDE\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/\"},\"author\":{\"name\":\"Manfred Steyer, GDE\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951\"},\"headline\":\"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen\",\"datePublished\":\"2016-06-17T10:08:18+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/\"},\"wordCount\":429,\"publisher\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"articleSection\":[\"Unkategorisiert\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/\",\"name\":\"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen - ANGULARarchitects\",\"isPartOf\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"datePublished\":\"2016-06-17T10:08:18+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage\",\"url\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"contentUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"width\":1280,\"height\":853},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.angulararchitects.io\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#website\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/\",\"name\":\"ANGULARarchitects\",\"description\":\"AngularArchitects.io\",\"publisher\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.angulararchitects.io\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\",\"name\":\"ANGULARarchitects\",\"alternateName\":\"SOFTWAREarchitects\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg\",\"contentUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg\",\"width\":644,\"height\":216,\"caption\":\"ANGULARarchitects\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/github.com\/angular-architects\",\"https:\/\/www.linkedin.com\/company\/angular-architects\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951\",\"name\":\"Manfred Steyer, GDE\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g\",\"caption\":\"Manfred Steyer, GDE\"},\"sameAs\":[\"https:\/\/x.com\/daniel\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen - ANGULARarchitects","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.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/","og_locale":"en_US","og_type":"article","og_title":"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen - ANGULARarchitects","og_description":"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen","og_url":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/","og_site_name":"ANGULARarchitects","article_published_time":"2016-06-17T10:08:18+00:00","og_image":[{"width":1280,"height":853,"url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","type":"image\/jpeg"}],"author":"Manfred Steyer, GDE","twitter_card":"summary_large_image","twitter_creator":"@daniel","twitter_misc":{"Written by":"Manfred Steyer, GDE","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#article","isPartOf":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/"},"author":{"name":"Manfred Steyer, GDE","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951"},"headline":"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen","datePublished":"2016-06-17T10:08:18+00:00","mainEntityOfPage":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/"},"wordCount":429,"publisher":{"@id":"https:\/\/www.angulararchitects.io\/en\/#organization"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage"},"thumbnailUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","articleSection":["Unkategorisiert"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/","url":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/","name":"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen - ANGULARarchitects","isPartOf":{"@id":"https:\/\/www.angulararchitects.io\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage"},"thumbnailUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","datePublished":"2016-06-17T10:08:18+00:00","breadcrumb":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#primaryimage","url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","contentUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","width":1280,"height":853},{"@type":"BreadcrumbList","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/mit-guards-ins-routing-des-angular-2-routers-eingreifen\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.angulararchitects.io\/en\/"},{"@type":"ListItem","position":2,"name":"Mit Guards Ins Routing Des Angular-2-Routers Eingreifen"}]},{"@type":"WebSite","@id":"https:\/\/www.angulararchitects.io\/en\/#website","url":"https:\/\/www.angulararchitects.io\/en\/","name":"ANGULARarchitects","description":"AngularArchitects.io","publisher":{"@id":"https:\/\/www.angulararchitects.io\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.angulararchitects.io\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.angulararchitects.io\/en\/#organization","name":"ANGULARarchitects","alternateName":"SOFTWAREarchitects","url":"https:\/\/www.angulararchitects.io\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg","contentUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg","width":644,"height":216,"caption":"ANGULARarchitects"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/github.com\/angular-architects","https:\/\/www.linkedin.com\/company\/angular-architects\/"]},{"@type":"Person","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951","name":"Manfred Steyer, GDE","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g","caption":"Manfred Steyer, GDE"},"sameAs":["https:\/\/x.com\/daniel"]}]}},"_links":{"self":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts\/2477","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/comments?post=2477"}],"version-history":[{"count":0,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts\/2477\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/media\/2997"}],"wp:attachment":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/media?parent=2477"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/categories?post=2477"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/tags?post=2477"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}