{"version":"1.0","provider_name":"Tutorial","provider_url":"https:\/\/www.vskills.in\/certification\/tutorial","author_name":"Team Vskills","author_url":"https:\/\/www.vskills.in\/certification\/tutorial\/author\/vskills_admin\/","title":"Component Interaction - Tutorial","type":"rich","width":600,"height":338,"html":"<blockquote class=\"wp-embedded-content\" data-secret=\"3ROD6Hp9Wt\"><a href=\"https:\/\/www.vskills.in\/certification\/tutorial\/component-interaction\/\">Component Interaction<\/a><\/blockquote><iframe sandbox=\"allow-scripts\" security=\"restricted\" src=\"https:\/\/www.vskills.in\/certification\/tutorial\/component-interaction\/embed\/#?secret=3ROD6Hp9Wt\" width=\"600\" height=\"338\" title=\"&#8220;Component Interaction&#8221; &#8212; Tutorial\" data-secret=\"3ROD6Hp9Wt\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" class=\"wp-embedded-content\"><\/iframe><script>\n\/*! This file is auto-generated *\/\n!function(d,l){\"use strict\";l.querySelector&&d.addEventListener&&\"undefined\"!=typeof URL&&(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&&!\/[^a-zA-Z0-9]\/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret=\"'+t.secret+'\"]'),o=l.querySelectorAll('blockquote[data-secret=\"'+t.secret+'\"]'),c=new RegExp(\"^https?:$\",\"i\"),i=0;i<o.length;i++)o[i].style.display=\"none\";for(i=0;i<a.length;i++)s=a[i],e.source===s.contentWindow&&(s.removeAttribute(\"style\"),\"height\"===t.message?(1e3<(r=parseInt(t.value,10))?r=1e3:~~r<200&&(r=200),s.height=r):\"link\"===t.message&&(r=new URL(s.getAttribute(\"src\")),n=new URL(t.value),c.test(n.protocol))&&n.host===r.host&&l.activeElement===s&&(d.top.location.href=t.value))}},d.addEventListener(\"message\",d.wp.receiveEmbedMessage,!1),l.addEventListener(\"DOMContentLoaded\",function(){for(var e,t,s=l.querySelectorAll(\"iframe.wp-embedded-content\"),r=0;r<s.length;r++)(t=(e=s[r]).getAttribute(\"data-secret\"))||(t=Math.random().toString(36).substring(2,12),e.src+=\"#?secret=\"+t,e.setAttribute(\"data-secret\",t)),e.contentWindow.postMessage({message:\"ready\",secret:t},\"*\")},!1)))}(window,document);\n\/\/# sourceURL=https:\/\/www.vskills.in\/certification\/tutorial\/wp-includes\/js\/wp-embed.min.js\n<\/script>\n","description":"Go back to Tutorial Common component communication scenarios are listed, in which two or more components share information. Pass data from parent to child with input binding HeroChildComponent has two input properties, typically adorned with @Input decorations. component-interaction\/src\/app\/hero-child.component.ts import { Component, Input } from &#8216;@angular\/core&#8217;; import { Hero } from &#8216;.\/hero&#8217;; @Component({ selector: &#8216;hero-child&#8217;, template:..."}