coding4developers.com Ads.txt file
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="/xmlrpc.php">
<title>www.Coding4Developers.com | Coding 4 Developers | Running Code| Coding for developers</title>
<meta name="description" itemprop="description" content="www.Coding4Developers.com is the running code website. It provide the codes which most of the time required during development. Search with Coding 4 developers and">
<meta name="keywords" itemprop="keywords" content="Coding 4 developers, Coding for developers, php, node js, angular js, xmpp, laravel, javascript, jquery, web development">
<link rel='next' href='/page/2/'>
<link rel="canonical" href="/">
<link rel="alternate" type="application/rss+xml" title="Coding 4 Developers » Feed" href="/feed/">
<link rel="alternate" type="application/rss+xml" title="Coding 4 Developers » Comments Feed" href="/comments/feed/">
<script type="text/javascript">
window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"http:\/\/www.coding4developers.com\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.5.25"}};
!function(e,o,t){var a,n,r;function i(e){var t=o.createElement("script");t.src=e,t.type="text/javascript",o.getElementsByTagName("head")[0].appendChild(t)}for(r=Array("simple","flag","unicode8","diversity"),t.supports={everything:!0,everythingExceptFlag:!0},n=0;n<r.length;n++)t.supports[r[n]]=function(e){var t,a,n=o.createElement("canvas"),r=n.getContext&&n.getContext("2d"),i=String.fromCharCode;if(!r||!r.fillText)return!1;switch(r.textBaseline="top",r.font="600 32px Arial",e){case"flag":return r.fillText(i(55356,56806,55356,56826),0,0),3e3<n.toDataURL().length;case"diversity":return r.fillText(i(55356,57221),0,0),a=(t=r.getImageData(16,16,1,1).data)[0]+","+t[1]+","+t[2]+","+t[3],r.fillText(i(55356,57221,55356,57343),0,0),a!=(t=r.getImageData(16,16,1,1).data)[0]+","+t[1]+","+t[2]+","+t[3];case"simple":return r.fillText(i(55357,56835),0,0),0!==r.getImageData(16,16,1,1).data[0];case"unicode8":return r.fillText(i(55356,57135),0,0),0!==r.getImageData(16,16,1,1).data[0]}return!1}(r[n]),t.supports.everything=t.supports.everything&&t.supports[r[n]],"flag"!==r[n]&&(t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&t.supports[r[n]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOMReady=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(a=function(){t.readyCallback()},o.addEventListener?(o.addEventListener("DOMContentLoaded",a,!1),e.addEventListener("load",a,!1)):(e.attachEvent("onload",a),o.attachEvent("onreadystatechange",function(){"complete"===o.readyState&&t.readyCallback()})),(a=t.source||{}).concatemoji?i(a.concatemoji):a.wpemoji&&a.twemoji&&(i(a.twemoji),i(a.wpemoji)))}(window,document,window._wpemojiSettings);
</script>
<style type="text/css">
img.wp-smiley,
img.emoji {
display: inline !important;
border: none !important;
box-shadow: none !important;
height: 1em !important;
width: 1em !important;
margin: 0 .07em !important;
vertical-align: -0.1em !important;
background: none !important;
padding: 0 !important;
}
</style>
<link rel='stylesheet' id='crayon-css' href='/wp-content/plugins/crayon-syntax-highlighter/css/min/crayon.min.css?ver=_2.7.2_beta' type='text/css' media='all'>
<link rel='stylesheet' id='crayon-theme-classic-css' href='/wp-content/plugins/crayon-syntax-highlighter/themes/classic/classic.css?ver=_2.7.2_beta' type='text/css' media='all'>
<link rel='stylesheet' id='crayon-font-monaco-css' href='/wp-content/plugins/crayon-syntax-highlighter/fonts/monaco.css?ver=_2.7.2_beta' type='text/css' media='all'>
<link rel='stylesheet' id='contact-form-7-css' href='/wp-content/plugins/contact-form-7/includes/css/styles.css?ver=4.5' type='text/css' media='all'>
<link rel='stylesheet' id='gglcptch-css' href='/wp-content/plugins/google-captcha/css/gglcptch.css?ver=1.33' type='text/css' media='all'>
<link rel='stylesheet' id='prefix-style-css' href='/wp-content/plugins/wp-share-buttons/style/front.end.css?ver=4.5.25' type='text/css' media='all'>
<link rel='stylesheet' id='boxy-fontawesome-css' href='/wp-content/themes/boxy/css/font-awesome.min.css?ver=4.5.25' type='text/css' media='all'>
<link rel='stylesheet' id='boxy-font-ptsans-css' href='//fonts.googleapis.com/css?family=PT+Sans%3A400%2C700&ver=4.5.25' type='text/css' media='all'>
<link rel='stylesheet' id='boxy-font-roboto-slab-css' href='//fonts.googleapis.com/css?family=Roboto+Slab%3A400%2C700&ver=4.5.25' type='text/css' media='all'>
<link rel='stylesheet' id='boxy-flexslider-css' href='/wp-content/themes/boxy/css/flexslider.css?ver=4.5.25' type='text/css' media='all'>
<link rel='stylesheet' id='boxy-style-css' href='/wp-content/themes/boxy/style.css?ver=4.5.25' type='text/css' media='all'>
<link rel='stylesheet' id='popup-maker-site-css' href='/wp-content/uploads/pum/pum-site-styles.css?generated=1566841925&ver=1.8.11' type='text/css' media='all'>
<link rel='stylesheet' id='ecae-frontend-css' href='/wp-content/plugins/easy-custom-auto-excerpt/assets/style-frontend.css?ver=2.4.6' type='text/css' media='all'>
<link rel='stylesheet' id='ecae-buttonskin-none-css' href='/wp-content/plugins/easy-custom-auto-excerpt/buttons/ecae-buttonskin-none.css?ver=2.4.6' type='text/css' media='all'>
<script type='text/javascript' src='/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var CrayonSyntaxSettings = {"version":"_2.7.2_beta","is_admin":"0","ajaxurl":"http:\/\/www.coding4developers.com\/wp-admin\/admin-ajax.php","prefix":"crayon-","setting":"crayon-setting","selected":"crayon-setting-selected","changed":"crayon-setting-changed","special":"crayon-setting-special","orig_value":"data-orig-value","debug":""};
var CrayonSyntaxStrings = {"copy":"Press %s to Copy, %s to Paste","minimize":"Click To Expand Code"};
/* ]]> */
</script>
<script type='text/javascript' src='/wp-content/plugins/crayon-syntax-highlighter/js/min/crayon.min.js?ver=_2.7.2_beta'></script>
<link rel='https://api.w.org/' href='/wp-json/'>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="/xmlrpc.php?rsd">
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="/wp-includes/wlwmanifest.xml">
<script type="text/javascript">
window._wp_rp_static_base_url = 'https://wprp.zemanta.com/static/';
window._wp_rp_wp_ajax_url = "http://www.coding4developers.com/wp-admin/admin-ajax.php";
window._wp_rp_plugin_version = '3.6';
window._wp_rp_post_id = '1475';
window._wp_rp_num_rel_posts = '6';
window._wp_rp_thumbnails = true;
window._wp_rp_post_title = 'MongoDB+insertMany%28%29+document+size+%7C+How+to+check+maxWriteBatchSize+in+MongoDB';
window._wp_rp_post_tags = ['mongo+db', 'replica', 'set', 'databas', 'group', 'mode', 'insert', '1', 'mongodb', 'size', 'collect', 'run', 'read', 'command', 'document', 'check'];
window._wp_rp_promoted_content = true;
</script>
<link rel="stylesheet" href="/wp-content/plugins/wordpress-23-related-posts-plugin/static/themes/vertical-m.css?version=3.6">
<script>
window.twttr=(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return;js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);t._e=[];t.ready=function(f){t._e.push(f);};return t;}(document,"script","twitter-wjs"));
</script>
<style type="text/css"></style>
<script>
window.OneSignal = window.OneSignal || [];
OneSignal.push( function() {
OneSignal.SERVICE_WORKER_UPDATER_PATH = "OneSignalSDKUpdaterWorker.js.php";
OneSignal.SERVICE_WORKER_PATH = "OneSignalSDKWorker.js.php";
OneSignal.SERVICE_WORKER_PARAM = { scope: '/' };
OneSignal.setDefaultNotificationUrl("http://www.coding4developers.com");
var oneSignal_options = {};
window._oneSignalInitOptions = oneSignal_options;
oneSignal_options['wordpress'] = true;
oneSignal_options['appId'] = 'dbe5651f-e382-4dce-be56-86a1f99491db';
oneSignal_options['autoRegister'] = true;
oneSignal_options['httpPermissionRequest'] = { };
oneSignal_options['httpPermissionRequest']['enable'] = true;
oneSignal_options['welcomeNotification'] = { };
oneSignal_options['welcomeNotification']['title'] = "";
oneSignal_options['welcomeNotification']['message'] = "";
oneSignal_options['subdomainName'] = "coding4devs.os.tc";
oneSignal_options['promptOptions'] = { };
oneSignal_options['notifyButton'] = { };
oneSignal_options['notifyButton']['enable'] = true;
oneSignal_options['notifyButton']['position'] = 'bottom-right';
oneSignal_options['notifyButton']['theme'] = 'default';
oneSignal_options['notifyButton']['size'] = 'medium';
oneSignal_options['notifyButton']['prenotify'] = true;
oneSignal_options['notifyButton']['showCredit'] = true;
oneSignal_options['notifyButton']['text'] = {};
OneSignal.init(window._oneSignalInitOptions);
});
function documentInitOneSignal() {
var oneSignal_elements = document.getElementsByClassName("OneSignal-prompt");
var oneSignalLinkClickHandler = function(event) { OneSignal.push(['registerForPushNotifications']); event.preventDefault(); }; for(var i = 0; i < oneSignal_elements.length; i++)
oneSignal_elements[i].addEventListener('click', oneSignalLinkClickHandler, false);
}
if (document.readyState === 'complete') {
documentInitOneSignal();
}
else {
window.addEventListener("load", function(event){
documentInitOneSignal();
});
}
</script>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1475 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1463 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1445 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1439 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1436 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1408 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1402 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1396 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1393 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
<style>
.huge-it-share-buttons {
border:0px solid #0FB5D6;
border-radius:5px;
text-align:left; }
#huge-it-share-buttons-top {margin-bottom:0px;}
#huge-it-share-buttons-bottom {margin-top:0px;}
.huge-it-share-buttons h3 {
font-size:25px ;
font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
color:#666666;
display:block; line-height:25px ;
text-align:left; }
.huge-it-share-buttons ul {
float:left; }
.huge-it-share-buttons ul li {
margin-left:3px !important;
margin-right:3px !important;
padding:0px;
border:0px ridge #E6354C;
border-radius:11px;
background-color:#14CC9B;
width:auto !important;
}
.huge-it-share-buttons ul li #backforunical1390 {
border-bottom: 0;
background-image:url('/wp-content/plugins/wp-share-buttons/Front_end/../images/buttons.30.png');
width:30px;
height:30px;
}
</style>
</head>
<body class="home blog">
<div id="page" class="hfeed site">
<a class="skip-link screen-reader-text" href="#content">Skip to content</a>
<header id="masthead" class="site-header" role="banner">
<div class="container">
<div class="sixteen columns">
<div class="logo site-branding">
<h1 class="site-title"><a href="/" rel="home">Coding 4 Developers</a></h1>
<h2 class="site-description">Running Code Website</h2>
</div>
</div>
</div>
<nav id="site-navigation" class="main-navigation" role="navigation">
<div class="container">
<div class="sixteen columns">
<button class="menu-toggle">Primary Menu</button>
<div class="primary-menu">
<ul id="menu-menu-1" class="menu">
<li id="menu-item-13" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-13">
<a href="/">Home</a>
</li>
<li id="menu-item-658" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-658">
<a href="/angular2-4-5-6-7-8/">Angular2,4,5,6,7,8</a>
</li>
<li id="menu-item-751" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-751">
<a href="/node-js/">Node.js</a>
</li>
<li id="menu-item-18" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-18">
<a href="/laravel/">LARAVEL</a>
</li>
<li id="menu-item-19" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19">
<a href="/php/">PHP</a>
</li>
<li id="menu-item-495" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-495">
<a href="/xmpp/">XMPP</a>
</li>
<li id="menu-item-16" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-16">
<a href="/javascript/">JAVASCRIPT</a>
</li>
<li id="menu-item-528" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-528">
<a href="/contact-us/">Contact Us</a>
</li>
<li id="menu-item-1385" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-1385">
<a href="/online-tests">Online Test</a>
<ul class="sub-menu">
<li id="menu-item-1386" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1386"></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</nav>
</header>
<div id="content" class="site-content container">
<div id="primary" class="content-area eleven columns">
<main id="main" class="site-main" role="main">
<div id="breadcrumb" role="navigation"></div>
<form role="search" style="margin-bottom: 2%;" method="get" action="http://www.coding4developers.com/">
<input type="search" style="width: 87%;" placeholder="Search …" value="" name="s"> <input type="submit" class="search-submit" value="Search">
</form>
<article id="post-1475" class="post-1475 post type-post status-publish format-standard hentry category-mongo-db">
<header class="entry-header">
<h1 class="entry-title"><a href="/mongo-db/mongodb-insertmany-document-size-how-to-check-maxwritebatchsize-in-mongodb/" rel="bookmark">MongoDB insertMany() document size | How to check maxWriteBatchSize in MongoDB</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p><strong>insertMany()</strong> function in MongoDB accepts array of objects and can insert multiple documents in the collections. Here is the syntax for insertMany() function:-</p>
<div id="crayon-61f344521fdc3379562747" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">db.collection.insertMany(
[ <document 1> , <document 2>, ... ],
{
writeConcern: <document>,
ordered: <boolean>
}
)</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344521fdc3379562747-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344521fdc3379562747-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f344521fdc3379562747-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344521fdc3379562747-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f344521fdc3379562747-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344521fdc3379562747-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f344521fdc3379562747-7">
7
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344521fdc3379562747-1">
<span class="crayon-v">db</span><span class="crayon-sy">.</span><span class="crayon-v">collection</span><span class="crayon-sy">.</span><span class="crayon-e">insertMany</span><span class="crayon-sy">(</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344521fdc3379562747-2">
<span class="crayon-h"> </span> <span class="crayon-sy">[</span> <span class="crayon-h"></span><span class="crayon-o"><</span><span class="crayon-i">document</span> <span class="crayon-h"></span><span class="crayon-cn">1</span><span class="crayon-o">></span> <span class="crayon-h"></span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-o"><</span><span class="crayon-i">document</span> <span class="crayon-h"></span><span class="crayon-cn">2</span><span class="crayon-o">></span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-sy">.</span><span class="crayon-sy">.</span><span class="crayon-sy">.</span> <span class="crayon-h"></span><span class="crayon-sy">]</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f344521fdc3379562747-3">
<span class="crayon-h"> </span> <span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344521fdc3379562747-4">
<span class="crayon-h"> </span><span class="crayon-v">writeConcern</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-o"><</span><span class="crayon-v">document</span><span class="crayon-o">></span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f344521fdc3379562747-5">
<span class="crayon-h"> </span><span class="crayon-v">ordered</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-o"><</span><span class="crayon-t">boolean</span><span class="crayon-o">></span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344521fdc3379562747-6">
<span class="crayon-h"> </span> <span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f344521fdc3379562747-7">
<span class="crayon-sy">)</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>The number of operations in each group cannot exceed the value of the <strong>maxWriteBatchSize</strong> of the database.</p>
<p>This can be checked by running the below query.</p>
<div id="crayon-61f344521fdcc096271867" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">db.runCommand( { hello: 1 } ).maxWriteBatchSize</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344521fdcc096271867-1">
1
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344521fdcc096271867-1">
<span class="crayon-v">db</span><span class="crayon-sy">.</span><span class="crayon-e">runCommand</span><span class="crayon-sy">(</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-v">hello</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">1</span> <span class="crayon-h"></span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-v">maxWriteBatchSize</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p><img class="alignnone size-full wp-image-1476" src="/wp-content/uploads/2021/08/Screenshot-from-2021-08-19-15-51-32.png" alt="insertMany() document size" width="965" height="425" srcset="/wp-content/uploads/2021/08/Screenshot-from-2021-08-19-15-51-32.png 965w, /wp-content/uploads/2021/08/Screenshot-from-2021-08-19-15-51-32-300x132.png 300w, /wp-content/uploads/2021/08/Screenshot-from-2021-08-19-15-51-32-768x338.png 768w" sizes="(max-width: 965px) 100vw, 965px"></p>
<p>You also can check other configurations by running this command, for example is you database is in read only mode, if isWritablePrimary is true then instance is primary in replica set. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/mongo-db/mongodb-insertmany-document-size-how-to-check-maxwritebatchsize-in-mongodb/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/mongo-db/mongodb-insertmany-document-size-how-to-check-maxwritebatchsize-in-mongodb/" rel="bookmark"><time class="entry-date published" datetime="2021-08-19T15:56:28+00:00">August 19, 2021</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/mongo-db/" rel="category tag">Mongo DB</a></span>
</footer>
</article>
<article id="post-1463" class="post-1463 post type-post status-publish format-standard hentry category-javascript category-node-js tag-jwt tag-nodejs">
<header class="entry-header">
<h1 class="entry-title"><a href="/javascript/jwt-we-dont-need-to-store-tokens-in-database/" rel="bookmark">JWT - Why we don't need to store tokens in database?</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>I discussed a question with many people and the question was - <strong>Do you store the JWT tokens in the database?</strong></p>
<p><strong>First Answer:</strong> <strong> </strong> Yes, we do store. Whenever we got an API call we get the token from the header and match it with the tokens that we have stored in DB.</p>
<p><strong>Second Answer:</strong> No, we don't store tokens in a database we simply get them verified by JWT itself. We get the token from the header and pass it JWT verify method like <strong>jwt.verify(token, secret).</strong></p>
<p>What I feel is that it is not required to store the tokens in the database. Because if you will be storing tokens in the database then you'll be setting some TTL(expiry time) there and on every request you will be verifying the token with user requested token and every time you'll update the TTL. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/javascript/jwt-we-dont-need-to-store-tokens-in-database/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/javascript/jwt-we-dont-need-to-store-tokens-in-database/" rel="bookmark"><time class="updated" datetime="2021-06-05T00:17:15+00:00">June 5, 2021</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/javascript/" rel="category tag">JAVASCRIPT</a>, <a href="/node-js/" rel="category tag">Node.js</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/jwt/" rel="tag">jwt</a>, <a href="/tag/nodejs/" rel="tag">nodejs</a></span>
</footer>
</article>
<article id="post-1445" class="post-1445 post type-post status-publish format-standard hentry category-node-js tag-nodejs tag-typescript tag-typescript-with-node-js">
<header class="entry-header">
<h1 class="entry-title"><a href="/node-js/how-to-use-typescript-with-node-js-building-a-node-js-app-with-typescript/" rel="bookmark">How to use Typescript with Node.js | Building a Node.js App with TypeScript</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>If you are using <strong>Javascript</strong> to build your application it's fine if that is a small application but once your application becomes big, it's really hard to manage the code quality.</p>
<p>To write the manageable and typed Javascript we started using <strong>Typescript</strong>. Typescript is just the superset of Javascript which is strictly typed.</p>
<p>The issue with Typescript is, it can't simply run on the browser or V8 engine. We need to transpile the Typescript to Javascript. Here in this article, we are going to use TSC to transpile the Typescript to Javascript. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/node-js/how-to-use-typescript-with-node-js-building-a-node-js-app-with-typescript/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/node-js/how-to-use-typescript-with-node-js-building-a-node-js-app-with-typescript/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:41:18+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/node-js/" rel="category tag">Node.js</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/nodejs/" rel="tag">nodejs</a>, <a href="/tag/typescript/" rel="tag">typescript</a>, <a href="/tag/typescript-with-node-js/" rel="tag">typescript with node.js</a></span>
</footer>
</article>
<article id="post-1439" class="post-1439 post type-post status-publish format-standard hentry category-angular2-4-5-6-7-8 tag-angular-directives tag-attribute-directive-example tag-hostlistener tag-mouse-events-in-angular tag-structural-directive">
<header class="entry-header">
<h1 class="entry-title"><a href="/angular2-4-5-6-7-8/custom-directives-in-angular-8-angular-directive-tutorial-with-example/" rel="bookmark">Custom Directives in Angular 8 | Angular Directive Tutorial With Example</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>I think <strong>directives</strong> are the most important bit in an Angular application. There are 3 types of directive in Angular which is listed below.</p>
<ol>
<li>Component Directive</li>
<li>Attribute Directive</li>
<li>Structural Directive</li>
</ol>
<p><strong>Component Directive:</strong></p>
<p>The <strong>component directive</strong> is something which is the core thing of angular application. We create components by using <strong>@Component</strong> decorator. The best example of component directive is AppComponent.</p>
<div id="crayon-61f3445220746564301035" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
}</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445220746564301035-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445220746564301035-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445220746564301035-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445220746564301035-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445220746564301035-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445220746564301035-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f3445220746564301035-7">
7
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445220746564301035-8">
8
</div>
<div class="crayon-num" data-line="crayon-61f3445220746564301035-9">
9
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445220746564301035-10">
10
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445220746564301035-1">
<span class="crayon-e">import</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-i">Component</span> <span class="crayon-h"></span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-i">from</span> <span class="crayon-h"></span><span class="crayon-s">'@angular/core'</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445220746564301035-2">
</div>
<div class="crayon-line" id="crayon-61f3445220746564301035-3">
<span class="crayon-sy">@</span><span class="crayon-e">Component</span><span class="crayon-sy">(</span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445220746564301035-4">
<span class="crayon-h"> </span><span class="crayon-v">selector</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'app-root'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445220746564301035-5">
<span class="crayon-h"> </span><span class="crayon-v">templateUrl</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'./app.component.html'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445220746564301035-6">
<span class="crayon-h"> </span><span class="crayon-v">styleUrls</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">[</span><span class="crayon-s">'./app.component.css'</span><span class="crayon-sy">]</span>
</div>
<div class="crayon-line" id="crayon-61f3445220746564301035-7">
<span class="crayon-sy">}</span><span class="crayon-sy">)</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445220746564301035-8">
<span class="crayon-e">export</span> <span class="crayon-h"></span><span class="crayon-t">class</span> <span class="crayon-h"></span><span class="crayon-e">AppComponent</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445220746564301035-9">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445220746564301035-10">
<span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p><strong>Attribute Directive:</strong></p>
<p>Creating a directive is pretty similar to a component, we user <strong>@Directive</strong> decorator for creating the directives. Attribute directives are used as attributes of elements. Let me explain this with an example: <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/angular2-4-5-6-7-8/custom-directives-in-angular-8-angular-directive-tutorial-with-example/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/angular2-4-5-6-7-8/custom-directives-in-angular-8-angular-directive-tutorial-with-example/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:40:29+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/angular2-4-5-6-7-8/" rel="category tag">Angular2,4,5,6,7,8</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/angular-directives/" rel="tag">angular directives</a>, <a href="/tag/attribute-directive-example/" rel="tag">attribute directive example</a>, <a href="/tag/hostlistener/" rel="tag">HostListener</a>, <a href="/tag/mouse-events-in-angular/" rel="tag">mouse events in angular</a>, <a href="/tag/structural-directive/" rel="tag">structural directive</a></span>
</footer>
</article>
<article id="post-1436" class="post-1436 post type-post status-publish format-standard hentry category-javascript tag-es6-array-functions-example tag-es6-some-function tag-javascript-difference-between-find-and-filter tag-javascript-filter-function-example tag-javascript-find-function-example">
<header class="entry-header">
<h1 class="entry-title"><a href="/javascript/difference-between-find-and-filter-in-javascript-es6-some-and-every-functions-example/" rel="bookmark">Difference between find() and filter() in JavaScript | ES6 some() and every() functions example</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>Many time we need to traverse the array data while building the application. Fortunately, JavaScript provides many array functions to do that but use case of these functions are different. Here in the below description, we'll discuss the <strong>ES6 array functions find() and filter()</strong>.</p>
<p><strong>If we only wanted to return the first matching element in the array: </strong>We use <strong>find()</strong> for this. .find() will look and stop after the first match. Let me explain with an example:</p>
<p>Let say we have a products array and we wanted to find the price of TV in below example:</p>
<div id="crayon-61f3445220975300769355" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">var products = [{name:'Bowl',price:1200},{name:'TV',price:15000},{name:'Table',price:2500},{name:'TV',price:14000}];
var result = products.find((product)=>{ return product.name==='TV'});
console.log(result);</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445220975300769355-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445220975300769355-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445220975300769355-3">
3
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445220975300769355-1">
<span class="crayon-t">var</span> <span class="crayon-h"></span><span class="crayon-v">products</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-sy">[</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'Bowl'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">1200</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'TV'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">15000</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'Table'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">2500</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'TV'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">14000</span><span class="crayon-sy">}</span><span class="crayon-sy">]</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445220975300769355-2">
<span class="crayon-t">var</span> <span class="crayon-h"></span><span class="crayon-v">result</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-v">products</span><span class="crayon-sy">.</span><span class="crayon-e">find</span><span class="crayon-sy">(</span><span class="crayon-sy">(</span><span class="crayon-v">product</span><span class="crayon-sy">)</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-v">product</span><span class="crayon-sy">.</span><span class="crayon-v">name</span><span class="crayon-o">===</span><span class="crayon-s">'TV'</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445220975300769355-3">
<span class="crayon-v">console</span><span class="crayon-sy">.</span><span class="crayon-e">log</span><span class="crayon-sy">(</span><span class="crayon-v">result</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>The output of the above script will be:</p>
<div id="crayon-61f344522097a751833033" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">{name: "TV", price: 15000}</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344522097a751833033-1">
1
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344522097a751833033-1">
<span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"TV"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-v">price</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">15000</span><span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>Now If we run <strong>filter()</strong> function in the same case then it will return the array of objects whose name is TV. .filter() will continue searching through the entire array.</p>
<div id="crayon-61f344522097b817546562" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">var products = [{name:'Bowl',price:1200},{name:'TV',price:15000},{name:'Table',price:2500},{name:'TV',price:14000}];
var result = products.filter((product)=>{ return product.name==='TV'});
console.log(result);</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344522097b817546562-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344522097b817546562-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f344522097b817546562-3">
3
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344522097b817546562-1">
<span class="crayon-t">var</span> <span class="crayon-h"></span><span class="crayon-v">products</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-sy">[</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'Bowl'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">1200</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'TV'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">15000</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'Table'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">2500</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span><span class="crayon-s">'TV'</span><span class="crayon-sy">,</span><span class="crayon-v">price</span><span class="crayon-o">:</span><span class="crayon-cn">14000</span><span class="crayon-sy">}</span><span class="crayon-sy">]</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344522097b817546562-2">
<span class="crayon-t">var</span> <span class="crayon-h"></span><span class="crayon-v">result</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-v">products</span><span class="crayon-sy">.</span><span class="crayon-e">filter</span><span class="crayon-sy">(</span><span class="crayon-sy">(</span><span class="crayon-v">product</span><span class="crayon-sy">)</span><span class="crayon-o">=</span><span class="crayon-o">></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-v">product</span><span class="crayon-sy">.</span><span class="crayon-v">name</span><span class="crayon-o">===</span><span class="crayon-s">'TV'</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f344522097b817546562-3">
<span class="crayon-v">console</span><span class="crayon-sy">.</span><span class="crayon-e">log</span><span class="crayon-sy">(</span><span class="crayon-v">result</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>The output of the above script will be:</p>
<div id="crayon-61f344522097d284569559" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">[{name: "TV", price: 15000},{name: "TV", price: 14000}]</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344522097d284569559-1">
1
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344522097d284569559-1">
<span class="crayon-sy">[</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"TV"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-v">price</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">15000</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">name</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"TV"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-v">price</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">14000</span><span class="crayon-sy">}</span><span class="crayon-sy">]</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>find() and filter() are only used when we wanted to return the matching results and use them but if we just wanted to check the existence of matching result, in that case, we can use <strong>some() and every() ES6 functions</strong>. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/javascript/difference-between-find-and-filter-in-javascript-es6-some-and-every-functions-example/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/javascript/difference-between-find-and-filter-in-javascript-es6-some-and-every-functions-example/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:38:47+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/javascript/" rel="category tag">JAVASCRIPT</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/es6-array-functions-example/" rel="tag">ES6 array functions example</a>, <a href="/tag/es6-some-function/" rel="tag">ES6 some() function</a>, <a href="/tag/javascript-difference-between-find-and-filter/" rel="tag">javascript difference between find() and filter()</a>, <a href="/tag/javascript-filter-function-example/" rel="tag">javascript filter() function example</a>, <a href="/tag/javascript-find-function-example/" rel="tag">javascript find() function example</a></span>
</footer>
</article>
<article id="post-1408" class="post-1408 post type-post status-publish format-standard hentry category-mongo-db tag-mongodb tag-mongodb-positional-operator tag-mongodb-update-array-of-objects tag-update">
<header class="entry-header">
<h1 class="entry-title"><a href="/mongo-db/mongodb-update-objects-in-a-documents-array-mongodb-update-object-in-array/" rel="bookmark">MongoDB - Update objects in a document's array | MongoDB update object in Array</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>Sometime in MongoDB, we need to update the object in the array for the particular matching document. We need to update either the first matching object or all the matching objects in the array. Let me give you an example of the documents. Let say I have the following collection whose name is items.</p>
<div id="crayon-61f3445221b48036166261" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">[
{
"_id" : ObjectId("4faaba123412d654fe83hg876"),
"user_id" : 123456,
"total" : 130,
"items" : [
{
"item_name" : "my_item_one",
"price" : 20
},
{
"item_name" : "my_item_two",
"price" : 50
},
{
"item_name" : "my_item_three",
"price" : 60
}
]
}
]</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-7">
7
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-8">
8
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-9">
9
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-10">
10
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-11">
11
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-12">
12
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-13">
13
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-14">
14
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-15">
15
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-16">
16
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-17">
17
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-18">
18
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-19">
19
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b48036166261-20">
20
</div>
<div class="crayon-num" data-line="crayon-61f3445221b48036166261-21">
21
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445221b48036166261-1">
<span class="crayon-sy">[</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-2">
<span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-3">
<span class="crayon-h"> </span><span class="crayon-s">"_id"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-e">ObjectId</span><span class="crayon-sy">(</span><span class="crayon-s">"4faaba123412d654fe83hg876"</span><span class="crayon-sy">)</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-4">
<span class="crayon-h"> </span><span class="crayon-s">"user_id"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">123456</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-5">
<span class="crayon-h"> </span><span class="crayon-s">"total"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">130</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-6">
<span class="crayon-h"> </span><span class="crayon-s">"items"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">[</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-7">
<span class="crayon-h"> </span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-8">
<span class="crayon-h"> </span><span class="crayon-s">"item_name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"my_item_one"</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-9">
<span class="crayon-h"> </span><span class="crayon-s">"price"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">20</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-10">
<span class="crayon-h"> </span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-11">
<span class="crayon-h"> </span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-12">
<span class="crayon-h"> </span><span class="crayon-s">"item_name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"my_item_two"</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-13">
<span class="crayon-h"> </span><span class="crayon-s">"price"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">50</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-14">
<span class="crayon-h"> </span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-15">
<span class="crayon-h"> </span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-16">
<span class="crayon-h"> </span><span class="crayon-s">"item_name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"my_item_three"</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-17">
<span class="crayon-h"> </span><span class="crayon-s">"price"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">60</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-18">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-19">
<span class="crayon-h"> </span><span class="crayon-sy">]</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b48036166261-20">
<span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b48036166261-21">
<span class="crayon-sy">]</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>Now I wanted to update the latest price of the item whose name is "my_item_two".</p>
<p>We achieve this through the <strong>positional operator ($). </strong>The positional operator is used to performing the operation on the particular position. Let me write the query for that:</p>
<div id="crayon-61f3445221b4e423165157" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">db.items.update(
// Match criteria
{
user_id: '123456',
'items.item_name': 'my_item_two'
},
// Update first matching array element using the positional operator ($)
{
$set: {
'items.$.price': 60,
}
}
)</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445221b4e423165157-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b4e423165157-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445221b4e423165157-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b4e423165157-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445221b4e423165157-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b4e423165157-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f3445221b4e423165157-7">
7
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b4e423165157-8">
8
</div>
<div class="crayon-num" data-line="crayon-61f3445221b4e423165157-9">
9
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b4e423165157-10">
10
</div>
<div class="crayon-num" data-line="crayon-61f3445221b4e423165157-11">
11
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b4e423165157-12">
12
</div>
<div class="crayon-num" data-line="crayon-61f3445221b4e423165157-13">
13
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b4e423165157-14">
14
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445221b4e423165157-1">
<span class="crayon-v">db</span><span class="crayon-sy">.</span><span class="crayon-v">items</span><span class="crayon-sy">.</span><span class="crayon-e">update</span><span class="crayon-sy">(</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b4e423165157-2">
<span class="crayon-h"> </span><span class="crayon-c">// Match criteria</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b4e423165157-3">
<span class="crayon-h"> </span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b4e423165157-4">
<span class="crayon-h"> </span><span class="crayon-v">user_id</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'123456'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b4e423165157-5">
<span class="crayon-h"> </span><span class="crayon-s">'items.item_name'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'my_item_two'</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b4e423165157-6">
<span class="crayon-h"> </span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b4e423165157-7">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b4e423165157-8">
<span class="crayon-h"> </span><span class="crayon-c">// Update first matching array element using the positional operator ($)</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b4e423165157-9">
<span class="crayon-h"> </span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b4e423165157-10">
<span class="crayon-h"> </span><span class="crayon-sy">$</span><span class="crayon-v">set</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b4e423165157-11">
<span class="crayon-h"> </span><span class="crayon-s">'items.$.price'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">60</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b4e423165157-12">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b4e423165157-13">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b4e423165157-14">
<span class="crayon-sy">)</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>This will update the first matching array element but sometime we may need to update all the matching array elements and we can do that by using the <strong>$[]</strong>. The all positional operator <code class="docutils literal"><span class="pre">$[]</span></code> indicates that the update operator should modify all elements in the specified array field.</p>
<div id="crayon-61f3445221b50159800552" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">db.items.updateMany(
// Match criteria
{
user_id: '123456',
'items.item_name': 'my_item_two'
},
// Update all matching array element using the positional operator ($)
{
$set: {
'items.$[].price': 60,
}
}
)</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445221b50159800552-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b50159800552-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445221b50159800552-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b50159800552-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445221b50159800552-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b50159800552-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f3445221b50159800552-7">
7
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b50159800552-8">
8
</div>
<div class="crayon-num" data-line="crayon-61f3445221b50159800552-9">
9
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b50159800552-10">
10
</div>
<div class="crayon-num" data-line="crayon-61f3445221b50159800552-11">
11
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b50159800552-12">
12
</div>
<div class="crayon-num" data-line="crayon-61f3445221b50159800552-13">
13
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221b50159800552-14">
14
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445221b50159800552-1">
<span class="crayon-v">db</span><span class="crayon-sy">.</span><span class="crayon-v">items</span><span class="crayon-sy">.</span><span class="crayon-e">updateMany</span><span class="crayon-sy">(</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b50159800552-2">
<span class="crayon-h"> </span><span class="crayon-c">// Match criteria</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b50159800552-3">
<span class="crayon-h"> </span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b50159800552-4">
<span class="crayon-h"> </span><span class="crayon-v">user_id</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'123456'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b50159800552-5">
<span class="crayon-h"> </span><span class="crayon-s">'items.item_name'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'my_item_two'</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b50159800552-6">
<span class="crayon-h"> </span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b50159800552-7">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b50159800552-8">
<span class="crayon-h"> </span><span class="crayon-c">// Update all matching array element using the positional operator ($)</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b50159800552-9">
<span class="crayon-h"> </span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b50159800552-10">
<span class="crayon-h"> </span><span class="crayon-sy">$</span><span class="crayon-v">set</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b50159800552-11">
<span class="crayon-h"> </span><span class="crayon-s">'items.$[].price'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">60</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b50159800552-12">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221b50159800552-13">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221b50159800552-14">
<span class="crayon-sy">)</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p> <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/mongo-db/mongodb-update-objects-in-a-documents-array-mongodb-update-object-in-array/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/mongo-db/mongodb-update-objects-in-a-documents-array-mongodb-update-object-in-array/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:38:08+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/mongo-db/" rel="category tag">Mongo DB</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/mongodb/" rel="tag">mongodb</a>, <a href="/tag/mongodb-positional-operator/" rel="tag">mongodb positional operator</a>, <a href="/tag/mongodb-update-array-of-objects/" rel="tag">mongodb update array of objects</a>, <a href="/tag/update/" rel="tag">update</a></span>
</footer>
</article>
<article id="post-1402" class="post-1402 post type-post status-publish format-standard hentry category-angular2-4-5-6-7-8 tag-age-old-validation-in-angular tag-alpha-numeric-validation tag-angular-8 tag-angular-form-validation tag-confirm-password-validation-in-angular tag-credit-card-validation-in-angular tag-email-id-validation-in-angular tag-number-validation-in-angular tag-reactive-form-validation tag-upto-decimal-point-validation-in-angular tag-url-validation-in-angular">
<header class="entry-header">
<h1 class="entry-title"><a href="/angular2-4-5-6-7-8/angular-8-reactive-forms-validation-example/" rel="bookmark">Angular 8 - Reactive Forms Validation Example | Angular Form Validation Example</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>Forms are always an integral part of our application. In angular, we build the form in 2 ways either template-driven or model-driven/reactive forms.</p>
<p>Here we are going to discuss reactive forms with Angular. Reactive forms are more scalable and can be managed easily. It's much simple way to validate the reactive forms. There are a number of validations which are commonly used in our application. Here we'll discuss the following validations:</p>
<ol>
<li>Confirm Password Validation in Angular 8</li>
<li>
<div>
URL Validation in Angular 8
</div>
</li>
<li>
<div>
Age-Old Validation in Angular 8
</div>
</li>
<li>
<div>
Up to Decimal Point Validation in Angular 8
</div>
</li>
<li>
<div>
Number Validation in Angular 8
</div>
</li>
<li>
<div>
Alpha Numeric Validation in Angular 8
</div>
</li>
<li>
<div>
Email Id Validation in Angular 8
</div>
</li>
<li>
<div>
Credit Card Validation in Angular 8
</div>
</li>
</ol>
<p><br>
<br>
<br>
<br>
Let me create a service which I'll use to validate the forms in my application: <strong>src/app/Services/validation.service</strong></p>
<div id="crayon-61f3445221d90442475345" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title">validation.service.ts</span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">import { AbstractControl } from '@angular/forms';
export class ValidationService {
// function to set error messages
static getValidatorErrorMessage(validatorName: string, validatorValue?: any) {
let config = {
'required': 'This field is required',
'twoDecimalAllowed': 'Decimal value upto 2 decimal places is allowed.',
'invalidNumber': 'Input should be an integer value',
'invalidCreditCard': 'Is invalid credit card number',
'invalidEmailAddress': 'Invalid email address',
'invalidPassword': 'New password and confirm password does not match',
'invalidDob': 'User must be minimum 16 Years old.',
'invalidUrl': 'Invalid URL',
'alphaNumericAllowed': 'Only apha numeric input is allowed',
'numericAllowed': 'Only numeric values are allowed',
'emailTaken': 'Email id already taken',
'minlength': `Minimum length should be ${validatorValue.requiredLength} characters`,
'maxlength': `Maximum length should be ${validatorValue.requiredLength} characters`
};
return config[validatorName];
}
static creditCardValidator(control: AbstractControl) {
// Visa, MasterCard, American Express, Diners Club, Discover, JCB
if (control.value.match(/^(?:4[0-9]{12}(?:[0-9]{3})?|5[1-5][0-9]{14}|6(?:011|5[0-9][0-9])[0-9]{12}|3[47][0-9]{13}|3(?:0[0-5]|[68][0-9])[0-9]{11}|(?:2131|1800|35\d{3})\d{11})$/)) {
return null;
} else {
return { 'invalidCreditCard': true };
}
}
static emailValidator(control: AbstractControl) {
if (control.value.length == 0 || control.value.match(/[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/)) {
return null;
} else {
return { 'invalidEmailAddress': true };
}
}
static alpaNumValidator(control: AbstractControl) {
if (control.value.match(/^[a-zA-Z0-9]*$/)) {
return null;
} else {
return { 'alphaNumericAllowed': true };
}
}
static numberValidator(control: AbstractControl) {
if (control.value.length == 0 || control.value.match(/^[0-9]*$/)) {
return null;
} else {
return { 'numericAllowed': true };
}
}
static decimalValidation(control: AbstractControl) {
if (control.value.match(/^\d*\.?\d{0,2}$/g)) {
return null;
} else {
return { 'twoDecimalAllowed': true };
}
}
// function to validate that dob should be 16 years old
static dobValidator(control: AbstractControl) {
let currentDate = new Date();
if (control.value) {
let dob = new Date(control.value);
let dobYear = dob.getFullYear();
let maxDobYear = currentDate.getFullYear() - 16;
//console.log(dobYear, maxDobYear)
if (maxDobYear < dobYear) {
return { 'invalidDob': true };
}
else {
return null
}
}
}
static urlValidator(control: AbstractControl) {
const URL_REGEXP = /^(http?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|in|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/;
if (control.value.match(URL_REGEXP)) {
return null;
} else {
return { 'invalidUrl': true };
}
}
static confirmPasswordValidator(control: AbstractControl) {
const password: string = control.get('password').value; // get password from our password form control
const confirmPassword: string = control.get('confirmPassword').value; // get password from our confirmPassword form control
if (password !== confirmPassword) {
control.get('confirmPassword').setErrors({ invalidPassword: true });
}
return null
}
}</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-7">
7
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-8">
8
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-9">
9
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-10">
10
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-11">
11
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-12">
12
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-13">
13
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-14">
14
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-15">
15
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-16">
16
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-17">
17
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-18">
18
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-19">
19
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-20">
20
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-21">
21
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-22">
22
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-23">
23
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-24">
24
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-25">
25
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-26">
26
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-27">
27
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-28">
28
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-29">
29
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-30">
30
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-31">
31
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-32">
32
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-33">
33
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-34">
34
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-35">
35
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-36">
36
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-37">
37
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-38">
38
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-39">
39
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-40">
40
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-41">
41
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-42">
42
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-43">
43
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-44">
44
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-45">
45
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-46">
46
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-47">
47
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-48">
48
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-49">
49
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-50">
50
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-51">
51
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-52">
52
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-53">
53
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-54">
54
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-55">
55
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-56">
56
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-57">
57
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-58">
58
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-59">
59
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-60">
60
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-61">
61
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-62">
62
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-63">
63
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-64">
64
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-65">
65
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-66">
66
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-67">
67
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-68">
68
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-69">
69
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-70">
70
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-71">
71
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-72">
72
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-73">
73
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-74">
74
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-75">
75
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-76">
76
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-77">
77
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-78">
78
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-79">
79
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-80">
80
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-81">
81
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-82">
82
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-83">
83
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-84">
84
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-85">
85
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-86">
86
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-87">
87
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-88">
88
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-89">
89
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-90">
90
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-91">
91
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-92">
92
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-93">
93
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-94">
94
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-95">
95
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-96">
96
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-97">
97
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-98">
98
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-99">
99
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-100">
100
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-101">
101
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445221d90442475345-102">
102
</div>
<div class="crayon-num" data-line="crayon-61f3445221d90442475345-103">
103
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445221d90442475345-1">
<span class="crayon-e">import</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-i">AbstractControl</span> <span class="crayon-h"></span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-i">from</span> <span class="crayon-h"></span><span class="crayon-s">'@angular/forms'</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-2">
<span class="crayon-e">export</span> <span class="crayon-h"></span><span class="crayon-t">class</span> <span class="crayon-h"></span><span class="crayon-e">ValidationService</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-3">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-4">
<span class="crayon-h"> </span><span class="crayon-c">// function to set error messages</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-5">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">getValidatorErrorMessage</span><span class="crayon-sy">(</span><span class="crayon-v">validatorName</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">string</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-v">validatorValue</span><span class="crayon-sy">?</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">any</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-6">
<span class="crayon-h"> </span><span class="crayon-e">let</span> <span class="crayon-v">config</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-7">
<span class="crayon-h"> </span><span class="crayon-s">'required'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'This field is required'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-8">
<span class="crayon-h"> </span><span class="crayon-s">'twoDecimalAllowed'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Decimal value upto 2 decimal places is allowed.'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-9">
<span class="crayon-h"> </span><span class="crayon-s">'invalidNumber'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Input should be an integer value'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-10">
<span class="crayon-h"> </span><span class="crayon-s">'invalidCreditCard'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Is invalid credit card number'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-11">
<span class="crayon-h"> </span><span class="crayon-s">'invalidEmailAddress'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Invalid email address'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-12">
<span class="crayon-h"> </span><span class="crayon-s">'invalidPassword'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'New password and confirm password does not match'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-13">
<span class="crayon-h"> </span><span class="crayon-s">'invalidDob'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'User must be minimum 16 Years old.'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-14">
<span class="crayon-h"> </span><span class="crayon-s">'invalidUrl'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Invalid URL'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-15">
<span class="crayon-h"> </span><span class="crayon-s">'alphaNumericAllowed'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Only apha numeric input is allowed'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-16">
<span class="crayon-h"> </span><span class="crayon-s">'numericAllowed'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Only numeric values are allowed'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-17">
<span class="crayon-h"> </span><span class="crayon-s">'emailTaken'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Email id already taken'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-18">
<span class="crayon-h"> </span><span class="crayon-s">'minlength'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">`</span><span class="crayon-e">Minimum</span> <span class="crayon-h"></span><span class="crayon-e">length</span> <span class="crayon-h"></span><span class="crayon-e">should</span> <span class="crayon-h"></span><span class="crayon-e">be</span> <span class="crayon-h"></span><span class="crayon-sy">$</span><span class="crayon-sy">{</span><span class="crayon-v">validatorValue</span><span class="crayon-sy">.</span><span class="crayon-v">requiredLength</span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-v">characters</span><span class="crayon-sy">`</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-19">
<span class="crayon-h"> </span><span class="crayon-s">'maxlength'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">`</span><span class="crayon-e">Maximum</span> <span class="crayon-h"></span><span class="crayon-e">length</span> <span class="crayon-h"></span><span class="crayon-e">should</span> <span class="crayon-h"></span><span class="crayon-e">be</span> <span class="crayon-h"></span><span class="crayon-sy">$</span><span class="crayon-sy">{</span><span class="crayon-v">validatorValue</span><span class="crayon-sy">.</span><span class="crayon-v">requiredLength</span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-v">characters</span><span class="crayon-sy">`</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-20">
<span class="crayon-h"> </span><span class="crayon-sy">}</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-21">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-22">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-v">config</span><span class="crayon-sy">[</span><span class="crayon-v">validatorName</span><span class="crayon-sy">]</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-23">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-24">
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-25">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">creditCardValidator</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">AbstractControl</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-26">
<span class="crayon-h"> </span><span class="crayon-c">// Visa, MasterCard, American Express, Diners Club, Discover, JCB</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-27">
<span class="crayon-h"> </span><span class="crayon-st">if</span> <span class="crayon-h"></span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">.</span><span class="crayon-e">match</span><span class="crayon-sy">(</span><span class="crayon-o">/</span><span class="crayon-o">^</span><span class="crayon-sy">(</span><span class="crayon-sy">?</span><span class="crayon-o">:</span><span class="crayon-cn">4</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">12</span><span class="crayon-sy">}</span><span class="crayon-sy">(</span><span class="crayon-sy">?</span><span class="crayon-o">:</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">3</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">?</span><span class="crayon-o">|</span><span class="crayon-cn">5</span><span class="crayon-sy">[</span><span class="crayon-cn">1</span><span class="crayon-o">-</span><span class="crayon-cn">5</span><span class="crayon-sy">]</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">14</span><span class="crayon-sy">}</span><span class="crayon-o">|</span><span class="crayon-cn">6</span><span class="crayon-sy">(</span><span class="crayon-sy">?</span><span class="crayon-o">:</span><span class="crayon-cn">011</span><span class="crayon-o">|</span><span class="crayon-cn">5</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">)</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">12</span><span class="crayon-sy">}</span><span class="crayon-o">|</span><span class="crayon-cn">3</span><span class="crayon-sy">[</span><span class="crayon-cn">47</span><span class="crayon-sy">]</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">13</span><span class="crayon-sy">}</span><span class="crayon-o">|</span><span class="crayon-cn">3</span><span class="crayon-sy">(</span><span class="crayon-sy">?</span><span class="crayon-o">:</span><span class="crayon-cn">0</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">5</span><span class="crayon-sy">]</span><span class="crayon-o">|</span><span class="crayon-sy">[</span><span class="crayon-cn">68</span><span class="crayon-sy">]</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">)</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">11</span><span class="crayon-sy">}</span><span class="crayon-o">|</span><span class="crayon-sy">(</span><span class="crayon-sy">?</span><span class="crayon-o">:</span><span class="crayon-cn">2131</span><span class="crayon-o">|</span><span class="crayon-cn">1800</span><span class="crayon-o">|</span><span class="crayon-cn">35</span><span class="crayon-sy">\</span><span class="crayon-e">d</span><span class="crayon-sy">{</span><span class="crayon-cn">3</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">\</span><span class="crayon-e">d</span><span class="crayon-sy">{</span><span class="crayon-cn">11</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">$</span><span class="crayon-o">/</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-28">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-t">null</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-29">
<span class="crayon-h"> </span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-st">else</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-30">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">'invalidCreditCard'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">true</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-31">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-32">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-33">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-34">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">emailValidator</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">AbstractControl</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-35">
<span class="crayon-h"> </span><span class="crayon-st">if</span> <span class="crayon-h"></span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">.</span><span class="crayon-v">length</span> <span class="crayon-h"></span><span class="crayon-o">==</span> <span class="crayon-h"></span><span class="crayon-cn">0</span> <span class="crayon-h"></span><span class="crayon-o">||</span> <span class="crayon-h"></span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">.</span><span class="crayon-e">match</span><span class="crayon-sy">(</span><span class="crayon-o">/</span><span class="crayon-sy">[</span><span class="crayon-v">a</span><span class="crayon-o">-</span><span class="crayon-v">z0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-o">!</span><span class="crayon-p">#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/)) {</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-36">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-t">null</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-37">
<span class="crayon-h"> </span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-st">else</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-38">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">'invalidEmailAddress'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">true</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-39">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-40">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-41">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-42">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">alpaNumValidator</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">AbstractControl</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-43">
<span class="crayon-h"> </span><span class="crayon-st">if</span> <span class="crayon-h"></span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">.</span><span class="crayon-e">match</span><span class="crayon-sy">(</span><span class="crayon-o">/</span><span class="crayon-o">^</span><span class="crayon-sy">[</span><span class="crayon-v">a</span><span class="crayon-o">-</span><span class="crayon-v">zA</span><span class="crayon-o">-</span><span class="crayon-v">Z0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-o">*</span><span class="crayon-sy">$</span><span class="crayon-o">/</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-44">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-t">null</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-45">
<span class="crayon-h"> </span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-st">else</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-46">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">'alphaNumericAllowed'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">true</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-47">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-48">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-49">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-50">
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-51">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">numberValidator</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">AbstractControl</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-52">
<span class="crayon-h"> </span><span class="crayon-st">if</span> <span class="crayon-h"></span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">.</span><span class="crayon-v">length</span> <span class="crayon-h"></span><span class="crayon-o">==</span> <span class="crayon-h"></span><span class="crayon-cn">0</span> <span class="crayon-h"></span><span class="crayon-o">||</span> <span class="crayon-h"></span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">.</span><span class="crayon-e">match</span><span class="crayon-sy">(</span><span class="crayon-o">/</span><span class="crayon-o">^</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-o">*</span><span class="crayon-sy">$</span><span class="crayon-o">/</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-53">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-t">null</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-54">
<span class="crayon-h"> </span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-st">else</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-55">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">'numericAllowed'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">true</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-56">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-57">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-58">
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-59">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-60">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">decimalValidation</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">AbstractControl</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-61">
<span class="crayon-h"> </span><span class="crayon-st">if</span> <span class="crayon-h"></span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">.</span><span class="crayon-e">match</span><span class="crayon-sy">(</span><span class="crayon-o">/</span><span class="crayon-o">^</span><span class="crayon-sy">\</span><span class="crayon-e">d*</span><span class="crayon-sy">\</span><span class="crayon-sy">.</span><span class="crayon-sy">?</span><span class="crayon-sy">\</span><span class="crayon-e">d</span><span class="crayon-sy">{</span><span class="crayon-cn">0</span><span class="crayon-sy">,</span><span class="crayon-cn">2</span><span class="crayon-sy">}</span><span class="crayon-sy">$</span><span class="crayon-o">/</span><span class="crayon-v">g</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-62">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-t">null</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-63">
<span class="crayon-h"> </span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-st">else</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-64">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">'twoDecimalAllowed'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">true</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-65">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-66">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-67">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-68">
<span class="crayon-h"> </span><span class="crayon-c">// function to validate that dob should be 16 years old</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-69">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">dobValidator</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">AbstractControl</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-70">
<span class="crayon-h"> </span><span class="crayon-e">let</span> <span class="crayon-v">currentDate</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-r">new</span> <span class="crayon-h"></span><span class="crayon-e">Date</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-71">
<span class="crayon-h"> </span><span class="crayon-st">if</span> <span class="crayon-h"></span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-72">
<span class="crayon-h"> </span><span class="crayon-e">let</span> <span class="crayon-v">dob</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-r">new</span> <span class="crayon-h"></span><span class="crayon-e">Date</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-sy">.</span><span class="crayon-v">value</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-73">
<span class="crayon-h"> </span><span class="crayon-e">let</span> <span class="crayon-v">dobYear</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-v">dob</span><span class="crayon-sy">.</span><span class="crayon-e">getFullYear</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-74">
<span class="crayon-h"> </span><span class="crayon-e">let</span> <span class="crayon-v">maxDobYear</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-v">currentDate</span><span class="crayon-sy">.</span><span class="crayon-e">getFullYear</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-o">-</span> <span class="crayon-h"></span><span class="crayon-cn">16</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-75">
<span class="crayon-h"> </span><span class="crayon-c">//console.log(dobYear, maxDobYear)</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-76">
<span class="crayon-h"> </span><span class="crayon-st">if</span> <span class="crayon-h"></span><span class="crayon-sy">(</span><span class="crayon-v">maxDobYear</span> <span class="crayon-h"></span><span class="crayon-o"><</span> <span class="crayon-h"></span><span class="crayon-v">dobYear</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-77">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">'invalidDob'</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">true</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-78">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-79">
<span class="crayon-h"> </span><span class="crayon-st">else</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-80">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-t">null</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-81">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-82">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-83">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-84">
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-85">
<span class="crayon-h"> </span><span class="crayon-m">static</span> <span class="crayon-h"></span><span class="crayon-e">urlValidator</span><span class="crayon-sy">(</span><span class="crayon-v">control</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">AbstractControl</span><span class="crayon-sy">)</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-86">
<span class="crayon-h"> </span><span class="crayon-m">const</span> <span class="crayon-h"></span><span class="crayon-v">URL_REGEXP</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-o">/</span><span class="crayon-o">^</span><span class="crayon-sy">(</span><span class="crayon-v">http</span><span class="crayon-sy">?</span><span class="crayon-o">|</span><span class="crayon-v">ftp</span><span class="crayon-sy">)</span><span class="crayon-o">:</span><span class="crayon-sy">\</span><span class="crayon-o">/</span><span class="crayon-sy">\</span><span class="crayon-o">/</span><span class="crayon-sy">(</span><span class="crayon-sy">[</span><span class="crayon-v">a</span><span class="crayon-o">-</span><span class="crayon-v">zA</span><span class="crayon-o">-</span><span class="crayon-v">Z0</span><span class="crayon-o">-</span><span class="crayon-cn">9.</span><span class="crayon-o">-</span><span class="crayon-sy">]</span><span class="crayon-o">+</span><span class="crayon-sy">(</span><span class="crayon-o">:</span><span class="crayon-sy">[</span><span class="crayon-v">a</span><span class="crayon-o">-</span><span class="crayon-v">zA</span><span class="crayon-o">-</span><span class="crayon-v">Z0</span><span class="crayon-o">-</span><span class="crayon-cn">9.</span><span class="crayon-o">&</span><span class="crayon-o">%</span><span class="crayon-sy">$</span><span class="crayon-o">-</span><span class="crayon-sy">]</span><span class="crayon-o">+</span><span class="crayon-sy">)</span><span class="crayon-o">*</span><span class="crayon-sy">@</span><span class="crayon-sy">)</span><span class="crayon-o">*</span><span class="crayon-sy">(</span><span class="crayon-sy">(</span><span class="crayon-cn">25</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">5</span><span class="crayon-sy">]</span><span class="crayon-o">|</span><span class="crayon-cn">2</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">4</span><span class="crayon-sy">]</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-o">|</span><span class="crayon-cn">1</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">2</span><span class="crayon-sy">}</span><span class="crayon-o">|</span><span class="crayon-sy">[</span><span class="crayon-cn">1</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">?</span><span class="crayon-sy">)</span><span class="crayon-sy">(</span><span class="crayon-sy">\</span><span class="crayon-sy">.</span><span class="crayon-sy">(</span><span class="crayon-cn">25</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">5</span><span class="crayon-sy">]</span><span class="crayon-o">|</span><span class="crayon-cn">2</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">4</span><span class="crayon-sy">]</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-o">|</span><span class="crayon-cn">1</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">2</span><span class="crayon-sy">}</span><span class="crayon-o">|</span><span class="crayon-sy">[</span><span class="crayon-cn">1</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">?</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">{</span><span class="crayon-cn">3</span><span class="crayon-sy">}</span><span class="crayon-o">|</span><span class="crayon-sy">(</span><span class="crayon-sy">[</span><span class="crayon-v">a</span><span class="crayon-o">-</span><span class="crayon-v">zA</span><span class="crayon-o">-</span><span class="crayon-v">Z0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-o">-</span><span class="crayon-sy">]</span><span class="crayon-o">+</span><span class="crayon-sy">\</span><span class="crayon-sy">.</span><span class="crayon-sy">)</span><span class="crayon-o">*</span><span class="crayon-sy">[</span><span class="crayon-v">a</span><span class="crayon-o">-</span><span class="crayon-v">zA</span><span class="crayon-o">-</span><span class="crayon-v">Z0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-o">-</span><span class="crayon-sy">]</span><span class="crayon-o">+</span><span class="crayon-sy">\</span><span class="crayon-sy">.</span><span class="crayon-sy">(</span><span class="crayon-v">com</span><span class="crayon-o">|</span><span class="crayon-st">in</span><span class="crayon-o">|</span><span class="crayon-v">edu</span><span class="crayon-o">|</span><span class="crayon-v">gov</span><span class="crayon-o">|</span><span class="crayon-t">int</span><span class="crayon-o">|</span><span class="crayon-v">mil</span><span class="crayon-o">|</span><span class="crayon-v">net</span><span class="crayon-o">|</span><span class="crayon-v">org</span><span class="crayon-o">|</span><span class="crayon-v">biz</span><span class="crayon-o">|</span><span class="crayon-v">arpa</span><span class="crayon-o">|</span><span class="crayon-v">info</span><span class="crayon-o">|</span><span class="crayon-v">name</span><span class="crayon-o">|</span><span class="crayon-v">pro</span><span class="crayon-o">|</span><span class="crayon-v">aero</span><span class="crayon-o">|</span><span class="crayon-v">coop</span><span class="crayon-o">|</span><span class="crayon-v">museum</span><span class="crayon-o">|</span><span class="crayon-sy">[</span><span class="crayon-e">a</span><span class="crayon-o">-</span><span class="crayon-e">zA</span><span class="crayon-o">-</span><span class="crayon-e">Z</span><span class="crayon-sy">]</span><span class="crayon-sy">{</span><span class="crayon-cn">2</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">(</span><span class="crayon-o">:</span><span class="crayon-sy">[</span><span class="crayon-cn">0</span><span class="crayon-o">-</span><span class="crayon-cn">9</span><span class="crayon-sy">]</span><span class="crayon-o">+</span><span class="crayon-sy">)</span><span class="crayon-o">*</span><span class="crayon-sy">(</span><span class="crayon-sy">\</span><span class="crayon-o">/</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-o">|</span><span class="crayon-sy">[</span><span class="crayon-v">a</span><span class="crayon-o">-</span><span class="crayon-v">zA</span><span class="crayon-o">-</span><span class="crayon-v">Z0</span><span class="crayon-o">-</span><span class="crayon-cn">9.</span><span class="crayon-sy">,</span><span class="crayon-sy">?</span><span class="crayon-s">'\\+&%$#=~_-]+))*$/;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-87">
<span class="crayon-s"> if (control.value.match(URL_REGEXP)) {</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-88">
<span class="crayon-s"> return null;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-89">
<span class="crayon-s"> } else {</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-90">
<span class="crayon-s"> return { '</span><span class="crayon-i">invalidUrl</span><span class="crayon-s">': true };</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-91">
<span class="crayon-s"> }</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-92">
<span class="crayon-s"> }</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-93">
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-94">
<span class="crayon-s"> static confirmPasswordValidator(control: AbstractControl) {</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-95">
<span class="crayon-s"> const password: string = control.get('</span><span class="crayon-i">password</span><span class="crayon-s">').value; // get password from our password form control</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-96">
<span class="crayon-s"> const confirmPassword: string = control.get('</span><span class="crayon-i">confirmPassword</span><span class="crayon-s">').value; // get password from our confirmPassword form control</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-97">
<span class="crayon-s"> if (password !== confirmPassword) {</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-98">
<span class="crayon-s"> control.get('</span><span class="crayon-i">confirmPassword</span>'<span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">setErrors</span><span class="crayon-sy">(</span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-v">invalidPassword</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">true</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-99">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-100">
<span class="crayon-h"> </span><span class="crayon-st">return</span> <span class="crayon-h"></span><span class="crayon-t">null</span>
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-101">
<span class="crayon-h"> </span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445221d90442475345-102">
</div>
<div class="crayon-line" id="crayon-61f3445221d90442475345-103">
<span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>Now let me create a validation message component. This is the common component which will be used throughout the forms to show the validation message. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/angular2-4-5-6-7-8/angular-8-reactive-forms-validation-example/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/angular2-4-5-6-7-8/angular-8-reactive-forms-validation-example/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:36:40+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/angular2-4-5-6-7-8/" rel="category tag">Angular2,4,5,6,7,8</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/age-old-validation-in-angular/" rel="tag">Age Old Validation in Angular</a>, <a href="/tag/alpha-numeric-validation/" rel="tag">Alpha Numeric Validation</a>, <a href="/tag/angular-8/" rel="tag">Angular 8</a>, <a href="/tag/angular-form-validation/" rel="tag">Angular form validation</a>, <a href="/tag/confirm-password-validation-in-angular/" rel="tag">Confirm Password Validation in Angular</a>, <a href="/tag/credit-card-validation-in-angular/" rel="tag">Credit Card Validation in Angular</a>, <a href="/tag/email-id-validation-in-angular/" rel="tag">Email Id Validation in Angular</a>, <a href="/tag/number-validation-in-angular/" rel="tag">Number Validation in Angular</a>, <a href="/tag/reactive-form-validation/" rel="tag">Reactive form validation</a>, <a href="/tag/upto-decimal-point-validation-in-angular/" rel="tag">Upto Decimal Point Validation in Angular</a>, <a href="/tag/url-validation-in-angular/" rel="tag">URL Validation in Angular</a></span>
</footer>
</article>
<article id="post-1396" class="post-1396 post type-post status-publish format-standard hentry category-mongo-db tag-mongo-db-dot-notation-match tag-mongodb-elemmatch-example tag-mongodb-match-in-array-of-objects">
<header class="entry-header">
<h1 class="entry-title"><a href="/mongo-db/mongodb-find-match-in-array-of-objects-mongodb-where-condition-with-array-of-objects-elemmatch-or-dot-notation-match/" rel="bookmark">MongoDB find match in array of objects || MongoDB where condition with array of objects | $elemMatch or dot notation match</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>In MongoDB, <strong>$elemMatch</strong> <strong>and dot notation</strong> are used to find the match in the array of objects. But both have some difference.<br>
Let me explain this with an example. Let say we have a document like:</p>
<div id="crayon-61f3445222048917500298" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">db.classes.insert([{
"_id" : 1,
"name" : "Class 10",
"students" : [
{ "rollNo" : 1, "name" : "Saurabh", "score" : 65, "section" : "A" },
{ "rollNo" : 2, "name" : "Gaurav", "score" : 90, "section" : "B" },
{ "rollNo" : 3, "name" : "Mrigank", "score" : 75, "section" : "C" }
]
},
{
"_id" : 2,
"name" : "Class 11",
"students" : [
{ "rollNo" : 1, "name" : "Satendra", "score" : 88, "section" : "B" },
{ "rollNo" : 2, "name" : "Shakshi", "score" : 91, "section" : "A" },
{ "rollNo" : 3, "name" : "Sachin", "score" : 82, "section" : "A" },
{ "rollNo" : 4, "name" : "Urvi", "score" : 55, "section" : "C" }
]
},
{
"_id" : 3,
"name" : "Class 12",
"students" : [
{ "rollNo" : 1, "name" : "Radha", "score" : 77, "section" : "B" },
{ "rollNo" : 2, "name" : "Geeta", "score" : 81, "section" : "A" }
]
}])</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445222048917500298-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-7">
7
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-8">
8
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-9">
9
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-10">
10
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-11">
11
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-12">
12
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-13">
13
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-14">
14
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-15">
15
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-16">
16
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-17">
17
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-18">
18
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-19">
19
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-20">
20
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-21">
21
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-22">
22
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-23">
23
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-24">
24
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-25">
25
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222048917500298-26">
26
</div>
<div class="crayon-num" data-line="crayon-61f3445222048917500298-27">
27
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445222048917500298-1">
<span class="crayon-v">db</span><span class="crayon-sy">.</span><span class="crayon-v">classes</span><span class="crayon-sy">.</span><span class="crayon-e">insert</span><span class="crayon-sy">(</span><span class="crayon-sy">[</span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-2">
<span class="crayon-h"> </span><span class="crayon-s">"_id"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">1</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-3">
<span class="crayon-h"> </span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 10"</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-4">
<span class="crayon-h"> </span><span class="crayon-s">"students"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">[</span><span class="crayon-h"> </span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-5">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">1</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Saurabh"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">65</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"A"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-6">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">2</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Gaurav"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">90</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"B"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-7">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">3</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Mrigank"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">75</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"C"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-h"> </span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-8">
<span class="crayon-h"> </span><span class="crayon-sy">]</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-9">
<span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-10">
<span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-11">
<span class="crayon-h"> </span><span class="crayon-s">"_id"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">2</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-12">
<span class="crayon-h"> </span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 11"</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-13">
<span class="crayon-h"> </span><span class="crayon-s">"students"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">[</span><span class="crayon-h"> </span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-14">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">1</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Satendra"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">88</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"B"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-15">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">2</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Shakshi"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">91</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"A"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-16">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">3</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Sachin"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">82</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"A"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-17">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">4</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Urvi"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">55</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"C"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-h"> </span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-18">
<span class="crayon-h"> </span><span class="crayon-sy">]</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-19">
<span class="crayon-sy">}</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-20">
<span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-21">
<span class="crayon-h"> </span><span class="crayon-s">"_id"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">3</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-22">
<span class="crayon-h"> </span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 12"</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-23">
<span class="crayon-h"> </span><span class="crayon-s">"students"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-sy">[</span><span class="crayon-h"> </span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-24">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">1</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Radha"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">77</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"B"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-h"> </span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-25">
<span class="crayon-h"> </span><span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"rollNo"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">2</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Geeta"</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"score"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-cn">81</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">"section"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"A"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span><span class="crayon-h"> </span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222048917500298-26">
<span class="crayon-h"> </span><span class="crayon-sy">]</span>
</div>
<div class="crayon-line" id="crayon-61f3445222048917500298-27">
<span class="crayon-sy">}</span><span class="crayon-sy">]</span><span class="crayon-sy">)</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p><strong>Now let me find the class name whose students has scored greater than 86.</strong></p>
<p>If using the dot notation then here is the example:</p>
<div id="crayon-61f344522204d114815837" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">db.classes.find({'students.score':{'$gt':86}},{_id:0, 'name':1);</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344522204d114815837-1">
1
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344522204d114815837-1">
<span class="crayon-v">db</span><span class="crayon-sy">.</span><span class="crayon-v">classes</span><span class="crayon-sy">.</span><span class="crayon-e">find</span><span class="crayon-sy">(</span><span class="crayon-sy">{</span><span class="crayon-s">'students.score'</span><span class="crayon-o">:</span><span class="crayon-sy">{</span><span class="crayon-s">'$gt'</span><span class="crayon-o">:</span><span class="crayon-cn">86</span><span class="crayon-sy">}</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">_id</span><span class="crayon-o">:</span><span class="crayon-cn">0</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">'name'</span><span class="crayon-o">:</span><span class="crayon-cn">1</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>The result will be :</p>
<div id="crayon-61f344522204e342735210" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">{ "name" : "Class 10" }
{ "name" : "Class 11" }</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344522204e342735210-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344522204e342735210-2">
2
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344522204e342735210-1">
<span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 10"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344522204e342735210-2">
<span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 11"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>Now If I find the class name whose students has scored greater than 86 and their section is A by using dot notation.</p>
<div id="crayon-61f3445222050195205604" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">db.classes.find({'students.score':{'$gt':86},'students.section':'A'},{_id:0, 'name':1);</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445222050195205604-1">
1
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445222050195205604-1">
<span class="crayon-v">db</span><span class="crayon-sy">.</span><span class="crayon-v">classes</span><span class="crayon-sy">.</span><span class="crayon-e">find</span><span class="crayon-sy">(</span><span class="crayon-sy">{</span><span class="crayon-s">'students.score'</span><span class="crayon-o">:</span><span class="crayon-sy">{</span><span class="crayon-s">'$gt'</span><span class="crayon-o">:</span><span class="crayon-cn">86</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-s">'students.section'</span><span class="crayon-o">:</span><span class="crayon-s">'A'</span><span class="crayon-sy">}</span><span class="crayon-sy">,</span><span class="crayon-sy">{</span><span class="crayon-v">_id</span><span class="crayon-o">:</span><span class="crayon-cn">0</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-s">'name'</span><span class="crayon-o">:</span><span class="crayon-cn">1</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>The result will be:</p>
<div id="crayon-61f3445222051836175849" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">{ "name" : "Class 10" }
{ "name" : "Class 11" }
{ "name" : "Class 12" }</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445222051836175849-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222051836175849-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445222051836175849-3">
3
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445222051836175849-1">
<span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 10"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222051836175849-2">
<span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 11"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445222051836175849-3">
<span class="crayon-sy">{</span> <span class="crayon-h"></span><span class="crayon-s">"name"</span> <span class="crayon-h"></span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">"Class 12"</span> <span class="crayon-h"></span><span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p><strong>Hence if we are using dot notation, Any condition match in students array, like score or section will be returning document.</strong><br>
<br>
<br>
<br>
But what if we wanted to match every condition? The answer is: We use $elemMatch for that. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/mongo-db/mongodb-find-match-in-array-of-objects-mongodb-where-condition-with-array-of-objects-elemmatch-or-dot-notation-match/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/mongo-db/mongodb-find-match-in-array-of-objects-mongodb-where-condition-with-array-of-objects-elemmatch-or-dot-notation-match/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:37:08+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/mongo-db/" rel="category tag">Mongo DB</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/mongo-db-dot-notation-match/" rel="tag">mongo db dot notation match</a>, <a href="/tag/mongodb-elemmatch-example/" rel="tag">mongodb $elemMatch example</a>, <a href="/tag/mongodb-match-in-array-of-objects/" rel="tag">mongodb match in array of objects</a></span>
</footer>
</article>
<article id="post-1393" class="post-1393 post type-post status-publish format-standard hentry category-angular2-4-5-6-7-8 tag-angular-typescript-interface tag-typescript-interface">
<header class="entry-header">
<h1 class="entry-title"><a href="/angular2-4-5-6-7-8/typescript-interfaces-why-use-interfaces/" rel="bookmark">TypeScript Interfaces | Why use interfaces in angular typescript</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<ul>
<li>An interface defines the syntax that an entity must have to follow.</li>
<li>Interfaces are only at compile time.</li>
<li>Interfaces contain only the declarations of the members.</li>
<li>A deriving class must define the required members.</li>
<li>It is also helpful in providing a structure.</li>
</ul>
<p>Let me give you an example with users interface: <strong>i-users.ts</strong></p>
<div id="crayon-61f3445222262144882340" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">export interface IUsers {
userName: string;
userId: string;
userEmail: string;
phone?: number;
}</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445222262144882340-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222262144882340-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445222262144882340-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222262144882340-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445222262144882340-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222262144882340-6">
6
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445222262144882340-1">
<span class="crayon-e">export</span> <span class="crayon-h"></span><span class="crayon-t">interface</span> <span class="crayon-h"></span><span class="crayon-e">IUsers</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222262144882340-2">
<span class="crayon-v">userName</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">string</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445222262144882340-3">
<span class="crayon-v">userId</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">string</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222262144882340-4">
<span class="crayon-v">userEmail</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">string</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line" id="crayon-61f3445222262144882340-5">
<span class="crayon-v">phone</span><span class="crayon-sy">?</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">number</span><span class="crayon-sy">;</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222262144882340-6">
<span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>And now let say we have a users service and inside that, we have a function 'updateUser' to update the user info.</p>
<div id="crayon-61f3445222267433888930" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">import {IUsers} from 'i-users'
----
---
public updateUser(id: string, userData: IUsers): Observable<IUsers> {
// make api call to update the user info
}
-----
-----</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445222267433888930-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222267433888930-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445222267433888930-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222267433888930-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445222267433888930-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222267433888930-6">
6
</div>
<div class="crayon-num" data-line="crayon-61f3445222267433888930-7">
7
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222267433888930-8">
8
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445222267433888930-1">
<span class="crayon-e">import</span> <span class="crayon-h"></span><span class="crayon-sy">{</span><span class="crayon-v">IUsers</span><span class="crayon-sy">}</span> <span class="crayon-h"></span><span class="crayon-i">from</span> <span class="crayon-h"></span><span class="crayon-s">'i-users'</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222267433888930-2">
<span class="crayon-o">--</span><span class="crayon-o">--</span>
</div>
<div class="crayon-line" id="crayon-61f3445222267433888930-3">
<span class="crayon-o">--</span><span class="crayon-o">-</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222267433888930-4">
<span class="crayon-m">public</span> <span class="crayon-h"></span><span class="crayon-e">updateUser</span><span class="crayon-sy">(</span><span class="crayon-v">id</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-t">string</span><span class="crayon-sy">,</span> <span class="crayon-h"></span><span class="crayon-v">userData</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-v">IUsers</span><span class="crayon-sy">)</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-e">Observable</span><span class="crayon-o"><</span><span class="crayon-e">IUsers</span><span class="crayon-o">></span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line" id="crayon-61f3445222267433888930-5">
<span class="crayon-c">// make api call to update the user info</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222267433888930-6">
<span class="crayon-sy">}</span>
</div>
<div class="crayon-line" id="crayon-61f3445222267433888930-7">
<span class="crayon-o">--</span><span class="crayon-o">--</span><span class="crayon-o">-</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222267433888930-8">
<span class="crayon-o">--</span><span class="crayon-o">--</span><span class="crayon-o">-</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p> </p>
<p>Here in the above code snippet, we are passing a parameter userData of type IUsers. This means we can not pass any other format except the IUsers.<br>
<strong>But did you notice we have a question mark (?) at property phone and which means phone is optional.</strong></p>
<p>So I can pass data something like:</p>
<div id="crayon-61f3445222268444058558" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">let userData = {
userName: 'Saurabh',
userId: '545154',
userEmail: 'info@www.coding4developers.com'
}</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445222268444058558-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222268444058558-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445222268444058558-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222268444058558-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f3445222268444058558-5">
5
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445222268444058558-1">
<span class="crayon-e">let</span> <span class="crayon-v">userData</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222268444058558-2">
<span class="crayon-v">userName</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Saurabh'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f3445222268444058558-3">
<span class="crayon-v">userId</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'545154'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222268444058558-4">
<span class="crayon-v">userEmail</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'info@www.coding4developers.com'</span>
</div>
<div class="crayon-line" id="crayon-61f3445222268444058558-5">
<span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p><strong>Here above userData is valid data to pass the API.</strong><br>
Now let's have another example of invalid parameters:</p>
<div id="crayon-61f344522226a048410207" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">let userData = {
userName: 'Saurabh',
userId: '545154',
userEmail: 'info@www.coding4developers.com',
city: 'Noida'
}</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f344522226a048410207-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344522226a048410207-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f344522226a048410207-3">
3
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344522226a048410207-4">
4
</div>
<div class="crayon-num" data-line="crayon-61f344522226a048410207-5">
5
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f344522226a048410207-6">
6
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f344522226a048410207-1">
<span class="crayon-e">let</span> <span class="crayon-v">userData</span> <span class="crayon-h"></span><span class="crayon-o">=</span> <span class="crayon-h"></span><span class="crayon-sy">{</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344522226a048410207-2">
<span class="crayon-v">userName</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Saurabh'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f344522226a048410207-3">
<span class="crayon-v">userId</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'545154'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344522226a048410207-4">
<span class="crayon-v">userEmail</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'info@www.coding4developers.com'</span><span class="crayon-sy">,</span>
</div>
<div class="crayon-line" id="crayon-61f344522226a048410207-5">
<span class="crayon-v">city</span><span class="crayon-o">:</span> <span class="crayon-h"></span><span class="crayon-s">'Noida'</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f344522226a048410207-6">
<span class="crayon-sy">}</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>Here this is invalid data because we have not declared the city in our interface and that's why this will result in an error at compile time.<br>
<br>
<br>
<br>
Interfaces are also helpful when sometime we forgot to pass a required parameter and this will help you at the compile time by telling that a particular member is not defined. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/angular2-4-5-6-7-8/typescript-interfaces-why-use-interfaces/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/angular2-4-5-6-7-8/typescript-interfaces-why-use-interfaces/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:42:34+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/angular2-4-5-6-7-8/" rel="category tag">Angular2,4,5,6,7,8</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/angular-typescript-interface/" rel="tag">angular typescript interface</a>, <a href="/tag/typescript-interface/" rel="tag">typescript interface</a></span>
</footer>
</article>
<article id="post-1390" class="post-1390 post type-post status-publish format-standard hentry category-angular2-4-5-6-7-8 tag-angular-8-feature tag-dynamic-import tag-load-children-routing">
<header class="entry-header">
<h1 class="entry-title"><a href="/angular2-4-5-6-7-8/angular-8-feature-using-loadchildren-to-lazy-load-your-module-angular-8-dynamic-ecmascript-imports/" rel="bookmark">Angular 8 feature | Using loadChildren to Lazy-Load your Module | Angular 8 dynamic EcmaScript imports</a></h1>
</header>
<div class="entry-content">
<div class="thumb"></div>
<div class='ecae' style='text-align:justify'>
<p>Lazy loading is the beautiful feature which Angular provides. We can load the modules only when the user navigates to their routes for the<br>
first time. It will increase the application performance and also will reduce the initial bundle size.<br>
The Angular Router has always supported lazy loading but now in Angular 8, we can dynamically import the lazy-loaded module only when it is needed.<br>
It is promise based and gives you access to the module whenever the module is called.</p>
<p>Let's create a transaction module for demonstrating the angular 8 dynamic EcmaScript imports:</p>
<div id="crayon-61f3445222457012476089" class="crayon-syntax crayon-theme-classic crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings="minimize scroll-mouseover" style="margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-toolbar" data-settings="mouseover overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<span class="crayon-title"></span>
<div class="crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">
<div class="crayon-button crayon-nums-button" title="Toggle Line Numbers">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-plain-button" title="Toggle Plain Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-expand-button" title="Expand Code">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-copy-button" title="Copy">
<div class="crayon-button-icon"></div>
</div>
<div class="crayon-button crayon-popup-button" title="Open Code In New Window">
<div class="crayon-button-icon"></div>
</div>
</div>
</div>
<div class="crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;"></div>
<div class="crayon-plain-wrap">
<textarea wrap="soft" class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 12px !important; line-height: 15px !important;">ng g c transactions/list
ng g c transactions/detail
ng g c transactions/create</textarea>
</div>
<div class="crayon-main" style="">
<table class="crayon-table">
<tr class="crayon-row">
<td class="crayon-nums" data-settings="show">
<div class="crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;">
<div class="crayon-num" data-line="crayon-61f3445222457012476089-1">
1
</div>
<div class="crayon-num crayon-striped-num" data-line="crayon-61f3445222457012476089-2">
2
</div>
<div class="crayon-num" data-line="crayon-61f3445222457012476089-3">
3
</div>
</div>
</td>
<td class="crayon-code">
<div class="crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;">
<div class="crayon-line" id="crayon-61f3445222457012476089-1">
<span class="crayon-i">ng</span> <span class="crayon-h"></span><span class="crayon-i">g</span> <span class="crayon-h"></span><span class="crayon-i">c</span> <span class="crayon-h"></span><span class="crayon-v">transactions</span><span class="crayon-o">/</span><span class="crayon-e">list</span>
</div>
<div class="crayon-line crayon-striped-line" id="crayon-61f3445222457012476089-2">
<span class="crayon-i">ng</span> <span class="crayon-h"></span><span class="crayon-i">g</span> <span class="crayon-h"></span><span class="crayon-i">c</span> <span class="crayon-h"></span><span class="crayon-v">transactions</span><span class="crayon-o">/</span><span class="crayon-e">detail</span>
</div>
<div class="crayon-line" id="crayon-61f3445222457012476089-3">
<span class="crayon-i">ng</span> <span class="crayon-h"></span><span class="crayon-i">g</span> <span class="crayon-h"></span><span class="crayon-i">c</span> <span class="crayon-h"></span><span class="crayon-v">transactions</span><span class="crayon-o">/</span><span class="crayon-v">create</span>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
<p>This will create a transaction list, detail and create components. <span class='ecae-dots'>...</span> <span class='ecae-button ecae-buttonskin-none' style='text-align:right;'><a class='ecae-link' href='/angular2-4-5-6-7-8/angular-8-feature-using-loadchildren-to-lazy-load-your-module-angular-8-dynamic-ecmascript-imports/'><span>Read More</span></a></span></p>
</div>
<div id="huge-it-share-buttons-top" class="huge-it-share-buttons nobackground">
<h3>Share This:</h3>
<ul class="huge-it-share-buttons-list">
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
<li class="none nobackground"></li>
</ul>
<div class="clear"></div>
</div><br class="clear">
</div>
<footer class="entry-meta">
<span class="posted-on"><span class="posted-on"><i class="fa fa-clock-o"></i> <a href="/angular2-4-5-6-7-8/angular-8-feature-using-loadchildren-to-lazy-load-your-module-angular-8-dynamic-ecmascript-imports/" rel="bookmark"><time class="updated" datetime="2019-10-02T22:43:49+00:00">October 2, 2019</time></a></span></span> <span class="cat-links"><i class="fa fa-list-alt"></i> <a href="/angular2-4-5-6-7-8/" rel="category tag">Angular2,4,5,6,7,8</a></span> <span class="tags-links"><i class="fa fa-tag"></i> <a href="/tag/angular-8-feature/" rel="tag">angular 8 feature</a>, <a href="/tag/dynamic-import/" rel="tag">dynamic import</a>, <a href="/tag/load-children-routing/" rel="tag">load children routing</a></span>
</footer>
</article>
<nav class="navigation paging-navigation" role="navigation">
<h1 class="screen-reader-text">Posts navigation</h1>
<div class="nav-links">
<div class="nav-previous">
<a href="/page/2/"><span class="meta-nav">←</span> Older posts</a>
</div>
</div>
</nav>
</main>
</div>
<div id="secondary" class="sidebar widget-area offset-by-one five columns" role="complementary">
<aside id="text-3" class="widget widget_text">
<div class="textwidget">
</div>
</aside>
<aside id="categories-2" class="widget widget_categories">
<h3 class="widget-title">Categories</h3>
<ul>
<li class="cat-item cat-item-44">
<a href="/ajax/">Ajax</a> (4)
</li>
<li class="cat-item cat-item-162">
<a href="/angular2-4-5-6-7-8/" title="Angular 2,4,5 is a TypeScript-based open-source front-end language and used for developing single page web applications. Now a days Angular js also widely used in developing Hybrid Mobile applications. ">Angular2,4,5,6,7,8</a> (16)
</li>
<li class="cat-item cat-item-4">
<a href="/angularjs/">ANGULARJS</a> (4)
</li>
<li class="cat-item cat-item-120">
<a href="/facebook-api/">Facebook API</a> (1)
</li>
<li class="cat-item cat-item-468">
<a href="/ffmpeg/">FFMPEG</a> (1)
</li>
<li class="cat-item cat-item-43">
<a href="/google-maps-api/">Google Maps API</a> (18)
</li>
<li class="cat-item cat-item-3">
<a href="/javascript/">JAVASCRIPT</a> (43)
</li>
<li class="cat-item cat-item-5">
<a href="/jquery/">JQUERY</a> (29)
</li>
<li class="cat-item cat-item-6">
<a href="/laravel/" title="Laravel is open source PHP Framework which follows Model View Controller (MVC) architecture and more preferable framework in all of the php framework. Laravel is used for developing web applications as well as web services.">LARAVEL</a> (25)
</li>
<li class="cat-item cat-item-106">
<a href="/mongo-db/">Mongo DB</a> (10)
</li>
<li class="cat-item cat-item-96">
<a href="/mysql/">MySql</a> (9)
</li>
<li class="cat-item cat-item-354">
<a href="/mysql-interview-question-answers/">MySQL Interview Question & Answers</a> (3)
</li>
<li class="cat-item cat-item-108">
<a href="/node-js/" title="Node.js is an open-source, cross-platform JavaScript run-time environment for executing JavaScript code server-side. Being JavaScript Node.js is also asynchronous programming!">Node.js</a> (18)
</li>
<li class="cat-item cat-item-2">
<a href="/php/" title="PHP is open source server side programming language which is widely used in web application and web services development.">PHP</a> (45)
</li>
<li class="cat-item cat-item-191">
<a href="/python/">Python</a> (1)
</li>
<li class="cat-item cat-item-457">
<a href="/react-js/">React.js</a> (1)
</li>
<li class="cat-item cat-item-312">
<a href="/redis/" title="Redis in an open source , in-memory data structure used as a database, caching, and message queues. It stores data into RAM to reduce the number of times an external data source must be read. These things can be done in Memcached as well but advantage of Redis is that it support various data structures like strings, hashes, lists, sets, sorted sets. Apart from that another most advantage is we can do Redis clustering as well like we do in other databases. Redis also can be used for transactions because Redis transaction is also atomic that means either all of the commands or none are processed.">Redis</a> (1)
</li>
<li class="cat-item cat-item-188">
<a href="/stripe/">Stripe</a> (2)
</li>
<li class="cat-item cat-item-75">
<a href="/xmpp/" title="XMPP (Extensible Messaging and Presence Protocol) is an open XML technology which is widely used for messaging, real time communications( like bidding in real time) and presence. You can use XMPP for building chat applications, group chat applications, showing users online/offline and sending data in real time like real time analytics or real time comment system. ">XMPP</a> (14)
</li>
<li class="cat-item cat-item-7">
<a href="/zend-framework/">ZEND FRAMEWORK</a> (8)
</li>
</ul>
</aside>
<aside id="newsletterwidget-2" class="widget widget_newsletterwidget">
<h3 class="widget-title">Subscribe to Coding 4 Developers</h3>
<script type="text/javascript">
//<![CDATA[
if (typeof newsletter_check !== "function") {
window.newsletter_check = function (f) {
var re = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-]{1,})+\.)+([a-zA-Z0-9]{2,})+$/;
if (!re.test(f.elements["ne"].value)) {
alert("The email is not correct");
return false;
}
for (var i=1; i<20; i++) {
if (f.elements["np" + i] && f.elements["np" + i].required && f.elements["np" + i].value == "") {
alert("");
return false;
}
}
if (f.elements["ny"] && !f.elements["ny"].checked) {
alert("You must accept the privacy statement");
return false;
}
return true;
}
}
//]]>
</script>
<div class="newsletter newsletter-widget">
<script type="text/javascript">
//<![CDATA[
if (typeof newsletter_check !== "function") {
window.newsletter_check = function (f) {
var re = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-]{1,})+\.)+([a-zA-Z0-9]{2,})+$/;
if (!re.test(f.elements["ne"].value)) {
alert("The email is not correct");
return false;
}
for (var i=1; i<20; i++) {
if (f.elements["np" + i] && f.elements["np" + i].required && f.elements["np" + i].value == "") {
alert("");
return false;
}
}
if (f.elements["ny"] && !f.elements["ny"].checked) {
alert("You must accept the privacy statement");
return false;
}
return true;
}
}
//]]>
</script>
<form action="http://www.coding4developers.com/?na=s" onsubmit="return newsletter_check(this)" method="post">
<input type="hidden" name="nr" value="widget">
<p><input class="newsletter-email" type="email" required="" name="ne" value="Email" onclick="if (this.defaultValue==this.value) this.value=''" onblur="if (this.value=='') this.value=this.defaultValue"></p>
<p><input class="newsletter-submit" type="submit" value="Subscribe"></p>
</form>
</div>
</aside>
<aside id="wplooktwitterfollowbutton-2" class="widget widget_wplooktwitterfollowbutton">
<h3 class="widget-title">Follow us on Twitter</h3>
<div class="container_wplooktwitterfollowbutton"></div>
</aside>
<aside id="text-2" class="widget widget_text">
<div class="textwidget">
</div>
</aside>
<aside id="recent-posts-4" class="widget widget_recent_entries">
<h3 class="widget-title">Recent Posts</h3>
<ul>
<li>
<a href="/mongo-db/mongodb-insertmany-document-size-how-to-check-maxwritebatchsize-in-mongodb/">MongoDB insertMany() document size | How to check maxWriteBatchSize in MongoDB</a>
</li>
<li>
<a href="/javascript/jwt-we-dont-need-to-store-tokens-in-database/">JWT - Why we don't need to store tokens in database?</a>
</li>
<li>
<a href="/node-js/how-to-use-typescript-with-node-js-building-a-node-js-app-with-typescript/">How to use Typescript with Node.js | Building a Node.js App with TypeScript</a>
</li>
<li>
<a href="/angular2-4-5-6-7-8/custom-directives-in-angular-8-angular-directive-tutorial-with-example/">Custom Directives in Angular 8 | Angular Directive Tutorial With Example</a>
</li>
<li>
<a href="/javascript/difference-between-find-and-filter-in-javascript-es6-some-and-every-functions-example/">Difference between find() and filter() in JavaScript | ES6 some() and every() functions example</a>
</li>
</ul>
</aside>
</div>
</div>
</div>
<footer id="colophon" class="site-footer" role="contentinfo">
<div class="footer-top">
<div class="container">
<div class="row">
<div class="four columns">
<aside id="nav_menu-2" class="widget widget_nav_menu">
<h3 class="widget-title">Information</h3>
<div class="menu-footer1-container">
<ul id="menu-footer1" class="menu">
<li id="menu-item-510" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-510">
<a href="/about-coding-for-developers/">About Coding 4 Developers</a>
</li>
<li id="menu-item-527" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-527">
<a href="/contact-us/">Contact Us</a>
</li>
<li id="menu-item-1078" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1078">
<a href="/privacy-policy/">Privacy Policy</a>
</li>
</ul>
</div>
</aside>
</div>
<div class="four columns">
<aside id="nav_menu-4" class="widget widget_nav_menu">
<h3 class="widget-title">Most Visited Categories</h3>
<div class="menu-most-visited-categories-container">
<ul id="menu-most-visited-categories" class="menu">
<li id="menu-item-876" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-876">
<a href="/angular2-4-5-6-7-8/">Angular2,4,5,6,7,8</a>
</li>
<li id="menu-item-873" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-873">
<a href="/php/">PHP</a>
</li>
<li id="menu-item-877" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-877">
<a href="/node-js/">Node.js</a>
</li>
<li id="menu-item-874" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-874">
<a href="/laravel/">LARAVEL</a>
</li>
<li id="menu-item-875" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-875">
<a href="/xmpp/">XMPP</a>
</li>
</ul>
</div>
</aside>
</div>
<div class="four columns">
<aside id="recent-posts-3" class="widget widget_recent_entries">
<h3 class="widget-title">Recent Posts</h3>
<ul>
<li>
<a href="/mongo-db/mongodb-insertmany-document-size-how-to-check-maxwritebatchsize-in-mongodb/">MongoDB insertMany() document size | How to check maxWriteBatchSize in MongoDB</a>
</li>
<li>
<a href="/javascript/jwt-we-dont-need-to-store-tokens-in-database/">JWT - Why we don't need to store tokens in database?</a>
</li>
<li>
<a href="/node-js/how-to-use-typescript-with-node-js-building-a-node-js-app-with-typescript/">How to use Typescript with Node.js | Building a Node.js App with TypeScript</a>
</li>
</ul>
</aside>
</div>
<div class="four columns">
<aside id="newsletterwidget-3" class="widget widget_newsletterwidget">
<h3 class="widget-title">Subscribe</h3>
<script type="text/javascript">
//<![CDATA[
if (typeof newsletter_check !== "function") {
window.newsletter_check = function (f) {
var re = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-]{1,})+\.)+([a-zA-Z0-9]{2,})+$/;
if (!re.test(f.elements["ne"].value)) {
alert("The email is not correct");
return false;
}
for (var i=1; i<20; i++) {
if (f.elements["np" + i] && f.elements["np" + i].required && f.elements["np" + i].value == "") {
alert("");
return false;
}
}
if (f.elements["ny"] && !f.elements["ny"].checked) {
alert("You must accept the privacy statement");
return false;
}
return true;
}
}
//]]>
</script>
<div class="newsletter newsletter-widget">
<script type="text/javascript">
//<![CDATA[
if (typeof newsletter_check !== "function") {
window.newsletter_check = function (f) {
var re = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-]{1,})+\.)+([a-zA-Z0-9]{2,})+$/;
if (!re.test(f.elements["ne"].value)) {
alert("The email is not correct");
return false;
}
for (var i=1; i<20; i++) {
if (f.elements["np" + i] && f.elements["np" + i].required && f.elements["np" + i].value == "") {
alert("");
return false;
}
}
if (f.elements["ny"] && !f.elements["ny"].checked) {
alert("You must accept the privacy statement");
return false;
}
return true;
}
}
//]]>
</script>
<form action="http://www.coding4developers.com/?na=s" onsubmit="return newsletter_check(this)" method="post">
<input type="hidden" name="nr" value="widget">
<p><input class="newsletter-email" type="email" required="" name="ne" value="Email" onclick="if (this.defaultValue==this.value) this.value=''" onblur="if (this.value=='') this.value=this.defaultValue"></p>
<p><input class="newsletter-submit" type="submit" value="Subscribe"></p>
</form>
</div>
</aside>
</div>
</div>
</div>
</div>
<div class="footer-bottom">
<div class="container">
<div class="sixteen columns">
<div class="site-info">
Proudly developed by <a href="/about-me" target="_blank">Saurabh</a>
</div>
</div>
</div>
</div>
</footer>
<script type='text/javascript' src='/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=3.51.0-2014.06.20'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var _wpcf7 = {"loaderUrl":"http:\/\/www.coding4developers.com\/wp-content\/plugins\/contact-form-7\/images\/ajax-loader.gif","recaptcha":{"messages":{"empty":"Please verify that you are not a robot."}},"sending":"Sending ..."};
/* ]]> */
</script>
<script type='text/javascript' src='/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.5'></script>
<script type='text/javascript' src='/wp-content/themes/boxy/js/navigation.js?ver=20120206'></script>
<script type='text/javascript' src='/wp-content/themes/boxy/js/skip-link-focus-fix.js?ver=20130115'></script>
<script type='text/javascript' src='/wp-content/themes/boxy/js/jquery.flexslider-min.js?ver=2.2.2'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/core.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/widget.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/tabs.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='/wp-content/themes/boxy/js/custom.js?ver=1.0'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/position.min.js?ver=1.11.4'></script>
<script type='text/javascript' src='/wp-content/uploads/pum/pum-site-scripts.js?defer&generated=1566841925&ver=1.8.11'></script>
<script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.5.25'></script>
</body>
</html>