text: <!doctype html>
  <html class="no-js" lang="">
      <head>
          <meta charset="utf-8">
          <meta http-equiv="x-ua-compatible" content="ie=edge">
          <title>angularspree documentation</title>
          <meta name="description" content="">
          <meta name="viewport" content="width=device-width, initial-scale=1">
  
          <link rel="icon" type="image/x-icon" href="../images/favicon.ico">
  	    <link rel="stylesheet" href="../styles/style.css">
      </head>
      <body>
  
          <div class="navbar navbar-default navbar-fixed-top visible-xs">
              <a href="../" class="navbar-brand">angularspree documentation</a>
              <button type="button" class="btn btn-default btn-menu fa fa-bars" id="btn-menu"></button>
          </div>
  
          <div class="xs-menu menu" id="mobile-menu">
              <div id="book-search-input" role="search">
                  <input type="text" placeholder="Type to search">
              </div>
              <nav>
              
                  <ul class="list">
              
                      <li class="title">
                          <a href="../index.html">angularspree documentation</a>
                      </li>
              
                      <li class="divider"></li>
              
              
                      <li class="chapter">
                          <a data-type="chapter-link" href="../index.html"><span class="fa fa-home"></span>Getting started</a>
                          <ul class="links">
                                  <li class="link">
                                      <a href="../index.html" ><span class="fa fa-file-text-o"></span>README</a>
                                  </li>
                                  <li class="link">
                                      <a 
                                          
                                           href="../overview.html" 
                                           href="../overview.html" 
                                          >
                                          <span class="fa fa-th"></span>Overview
                                      </a>
                                  </li>
                          </ul>
                      </li>
              
              
                      <li class="chapter">
                          <a data-type="chapter-link" href="../modules.html" >
                              <span class="fa fa-archive"></span>
                              <span>Modules</span>
                              <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                      data-target="#xs-modules-links"
                              ></span>
                          </a>
                          <ul class="links collapse in"
                                  id="xs-modules-links"
                              >
                                  <li class="link">
                                      <a href="../modules/AddressModule.html" >AddressModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/AppModule.html" >AppModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/AuthModule.html" >AuthModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/CartModule.html" >CartModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/CheckoutModule.html" >CheckoutModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/CoreModule.html" >CoreModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/HomeModule.html" >HomeModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/LayoutModule.html" >LayoutModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/PaymentModule.html" >PaymentModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/ProductModule.html" >ProductModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/SharedModule.html" >SharedModule</a>
                                  </li>
                                  <li class="link">
                                      <a href="../modules/UserModule.html" >UserModule</a>
                                  </li>
                          </ul>
                      </li>
              
                      <li class="chapter">
                          <div class="simple">
                              <span class="fa fa-cogs"></span>
                              <span>Components</span>
                              <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                      data-target="#xs-components-links"
                                  ></span>
                          </div>
                          <ul class="links collapse in"
                                  id="xs-components-links"
                              >
                                  <li class="link">
                                      <a href="../components/AddAddressComponent.html" >AddAddressComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/AddressComponent.html" >AddressComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/AddressesComponent.html" >AddressesComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/AppComponent.html" >AppComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/BreadcrumbComponent.html" >BreadcrumbComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/CartComponent.html" >CartComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/CashOnDeliveryComponent.html" >CashOnDeliveryComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/CheckoutFooterComponent.html" >CheckoutFooterComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/CheckoutHeaderComponent.html" >CheckoutHeaderComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ContentComponent.html" >ContentComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ContentHeaderComponent.html" >ContentHeaderComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/CreditCardComponent.html" >CreditCardComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/CustomizeComponent.html" >CustomizeComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/DeliveryAddressComponent.html" >DeliveryAddressComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/DeliveryOptionsComponent.html" >DeliveryOptionsComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/EmptyCartComponent.html" >EmptyCartComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/FilterComponent.html" >FilterComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/FilterSummaryComponent.html" >FilterSummaryComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/FooterComponent.html" >FooterComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/HeaderComponent.html" >HeaderComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/HomeComponent.html" >HomeComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/LineItemComponent.html" >LineItemComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/LineItemListComponent.html" >LineItemListComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/LoadingIndicatorComponent.html" >LoadingIndicatorComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/LoginComponent.html" >LoginComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/NetBankingComponent.html" >NetBankingComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/NotificationComponent.html"  data-type="entity-link" class="active" >NotificationComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/OrderDetailComponent.html" >OrderDetailComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/OrderListItemComponent.html" >OrderListItemComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/OrderTotalSummaryComponent.html" >OrderTotalSummaryComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/OrdersComponent.html" >OrdersComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/OverviewComponent.html" >OverviewComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/PaymentComponent.html" >PaymentComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/PaymentModeComponent.html" >PaymentModeComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/PaymentModesListComponent.html" >PaymentModesListComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductComponent.html" >ProductComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductDescriptionComponent.html" >ProductDescriptionComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductDetailPageComponent.html" >ProductDetailPageComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductDetailsComponent.html" >ProductDetailsComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductImagesComponent.html" >ProductImagesComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductListComponent.html" >ProductListComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductListItemComponent.html" >ProductListItemComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductPriceInfoComponent.html" >ProductPriceInfoComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProductVariantsComponent.html" >ProductVariantsComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ProfileDropdownComponent.html" >ProfileDropdownComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ReturnListItemComponent.html" >ReturnListItemComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/ReturnsComponent.html" >ReturnsComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/SignUpComponent.html" >SignUpComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/TaxonsComponent.html" >TaxonsComponent</a>
                                  </li>
                                  <li class="link">
                                      <a href="../components/UserComponent.html" >UserComponent</a>
                                  </li>
                          </ul>
                      </li>
              
              
                      <li class="chapter">
                          <div class="simple">
                              <span class="fa fa-file-code-o"></span>
                              <span>Classes</span>
                              <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                      data-target="#xs-classes-links"
                                  ></span>
                          </div>
                          <ul class="links collapse in"
                                  id="xs-classes-links"
                              >
                                  <li class="link">
                                      <a href="../classes/Address.html" >Address</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/AuthActions.html" >AuthActions</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/CheckoutActions.html" >CheckoutActions</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/Classification.html" >Classification</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/Image.html" >Image</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/LightOrder.html" >LightOrder</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/LineItem.html" >LineItem</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/OptionType.html" >OptionType</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/OptionValue.html" >OptionValue</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/Order.html" >Order</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/Payment.html" >Payment</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/PaymentMode.html" >PaymentMode</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/Product.html" >Product</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/ProductActions.html" >ProductActions</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/ProductProperty.html" >ProductProperty</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/SearchActions.html" >SearchActions</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/Taxon.html" >Taxon</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/User.html" >User</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/UserActions.html" >UserActions</a>
                                  </li>
                                  <li class="link">
                                      <a href="../classes/Variant.html" >Variant</a>
                                  </li>
                          </ul>
                      </li>
              
                      <li class="chapter">
                          <div class="simple">
                              <span class="fa fa-long-arrow-down"></span>
                              <span>Injectables</span>
                              <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                      data-target="#xs-injectables-links"
                                  ></span>
                          </div>
                          <ul class="links collapse in"
                                  id="xs-injectables-links"
                              >
                                  <li class="link">
                                      <a href="../injectables/AddressService.html" >AddressService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/AuthService.html" >AuthService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/AuthenticationEffects.html" >AuthenticationEffects</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/CanActivateViaAuthGuard.html" >CanActivateViaAuthGuard</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/CheckoutEffects.html" >CheckoutEffects</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/CheckoutService.html" >CheckoutService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/FilterPipe.html" >FilterPipe</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/HttpService.html" >HttpService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/PaymentService.html" >PaymentService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/ProductEffects.html" >ProductEffects</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/ProductService.html" >ProductService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/UserEffects.html" >UserEffects</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/UserService.html" >UserService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/VariantParserService.html" >VariantParserService</a>
                                  </li>
                                  <li class="link">
                                      <a href="../injectables/VariantRetriverService.html" >VariantRetriverService</a>
                                  </li>
                          </ul>
                      </li>
              
                      <li class="chapter">
                          <div class="simple">
                              <span class="fa fa-info"></span>
                              <span>Interfaces</span>
                              <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                      data-target="#xs-interfaces-links"
                                  ></span>
                          </div>
                          <ul class="links collapse in"
                                  id="xs-interfaces-links"
                              >
                                  <li class="link">
                                      <a href="../interfaces/AppState.html" >AppState</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/AuthState.html" >AuthState</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/CheckoutState.html" >CheckoutState</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/CurrentSelectedOptionsType.html" >CurrentSelectedOptionsType</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/OptionTypesHash.html" >OptionTypesHash</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/ProductState.html" >ProductState</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/SearchState.html" >SearchState</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/Taxonomy.html" >Taxonomy</a>
                                  </li>
                                  <li class="link">
                                      <a href="../interfaces/UserState.html" >UserState</a>
                                  </li>
                          </ul>
                      </li>
              
                      <li class="chapter">
                          <div class="simple">
                              <span class="fa fa-plus"></span>
                              <span>Pipes</span>
                              <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                      data-target="#xs-pipes-links"
                                  ></span>
                          </div>
                          <ul class="links collapse in"
                                  id="xs-pipes-links"
                              >
                                  <li class="link">
                                      <a href="../pipes/FilterPipe.html" >FilterPipe</a>
                                  </li>
                                  <li class="link">
                                      <a href="../pipes/HumanizePipe.html" >HumanizePipe</a>
                                  </li>
                                  <li class="link">
                                      <a href="../pipes/KeysPipe.html" >KeysPipe</a>
                                  </li>
                          </ul>
                      </li>
              
              
                      <li class="chapter">
                          <a data-type="chapter-link" href="../miscellaneous.html" ><span class="fa fa-cubes"></span>Miscellaneous</a>
                      </li>
              
                      <li class="chapter">
                          <a data-type="chapter-link" href="../coverage.html" ><span class="fa fa-tasks"></span>Documentation coverage</a>
                      </li>
              
                      <li class="divider"></li>
                      <li class="copyright">
                              Documentation generated using <a href="https://compodoc.github.io/website/" target="_blank">
                                          <img src="..//images/compodoc-vectorise.svg" class="img-responsive">
                              </a>
                      </li>
              
                  </ul>
              
              </nav>
          </div>
  
          <div class="container-fluid main">
             <div class="row main">
                 <div class="hidden-xs menu">
                     <nav>
                     
                         <ul class="list">
                     
                             <li class="title">
                                 <a href="../index.html">angularspree documentation</a>
                             </li>
                     
                             <li class="divider"></li>
                     
                                 <div id="book-search-input" role="search">
                                     <input type="text" placeholder="Type to search">
                                 </div>
                     
                             <li class="chapter">
                                 <a data-type="chapter-link" href="../index.html"><span class="fa fa-home"></span>Getting started</a>
                                 <ul class="links">
                                         <li class="link">
                                             <a href="../index.html" ><span class="fa fa-file-text-o"></span>README</a>
                                         </li>
                                         <li class="link">
                                             <a 
                                                 
                                                  href="../overview.html" 
                                                  href="../overview.html" 
                                                 >
                                                 <span class="fa fa-th"></span>Overview
                                             </a>
                                         </li>
                                 </ul>
                             </li>
                     
                     
                             <li class="chapter">
                                 <a data-type="chapter-link" href="../modules.html" >
                                     <span class="fa fa-archive"></span>
                                     <span>Modules</span>
                                     <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                             data-target="#modules-links"
                                     ></span>
                                 </a>
                                 <ul class="links collapse in"
                                         id="modules-links"
                     >
                                         <li class="link">
                                             <a href="../modules/AddressModule.html" >AddressModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/AppModule.html" >AppModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/AuthModule.html" >AuthModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/CartModule.html" >CartModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/CheckoutModule.html" >CheckoutModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/CoreModule.html" >CoreModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/HomeModule.html" >HomeModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/LayoutModule.html" >LayoutModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/PaymentModule.html" >PaymentModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/ProductModule.html" >ProductModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/SharedModule.html" >SharedModule</a>
                                         </li>
                                         <li class="link">
                                             <a href="../modules/UserModule.html" >UserModule</a>
                                         </li>
                                 </ul>
                             </li>
                     
                             <li class="chapter">
                                 <div class="simple">
                                     <span class="fa fa-cogs"></span>
                                     <span>Components</span>
                                     <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                             data-target="#components-links"
                     ></span>
                                 </div>
                                 <ul class="links collapse in"
                                         id="components-links"
                     >
                                         <li class="link">
                                             <a href="../components/AddAddressComponent.html" >AddAddressComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/AddressComponent.html" >AddressComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/AddressesComponent.html" >AddressesComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/AppComponent.html" >AppComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/BreadcrumbComponent.html" >BreadcrumbComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/CartComponent.html" >CartComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/CashOnDeliveryComponent.html" >CashOnDeliveryComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/CheckoutFooterComponent.html" >CheckoutFooterComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/CheckoutHeaderComponent.html" >CheckoutHeaderComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ContentComponent.html" >ContentComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ContentHeaderComponent.html" >ContentHeaderComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/CreditCardComponent.html" >CreditCardComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/CustomizeComponent.html" >CustomizeComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/DeliveryAddressComponent.html" >DeliveryAddressComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/DeliveryOptionsComponent.html" >DeliveryOptionsComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/EmptyCartComponent.html" >EmptyCartComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/FilterComponent.html" >FilterComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/FilterSummaryComponent.html" >FilterSummaryComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/FooterComponent.html" >FooterComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/HeaderComponent.html" >HeaderComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/HomeComponent.html" >HomeComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/LineItemComponent.html" >LineItemComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/LineItemListComponent.html" >LineItemListComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/LoadingIndicatorComponent.html" >LoadingIndicatorComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/LoginComponent.html" >LoginComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/NetBankingComponent.html" >NetBankingComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/NotificationComponent.html"  data-type="entity-link" class="active" >NotificationComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/OrderDetailComponent.html" >OrderDetailComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/OrderListItemComponent.html" >OrderListItemComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/OrderTotalSummaryComponent.html" >OrderTotalSummaryComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/OrdersComponent.html" >OrdersComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/OverviewComponent.html" >OverviewComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/PaymentComponent.html" >PaymentComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/PaymentModeComponent.html" >PaymentModeComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/PaymentModesListComponent.html" >PaymentModesListComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductComponent.html" >ProductComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductDescriptionComponent.html" >ProductDescriptionComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductDetailPageComponent.html" >ProductDetailPageComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductDetailsComponent.html" >ProductDetailsComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductImagesComponent.html" >ProductImagesComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductListComponent.html" >ProductListComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductListItemComponent.html" >ProductListItemComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductPriceInfoComponent.html" >ProductPriceInfoComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProductVariantsComponent.html" >ProductVariantsComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ProfileDropdownComponent.html" >ProfileDropdownComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ReturnListItemComponent.html" >ReturnListItemComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/ReturnsComponent.html" >ReturnsComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/SignUpComponent.html" >SignUpComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/TaxonsComponent.html" >TaxonsComponent</a>
                                         </li>
                                         <li class="link">
                                             <a href="../components/UserComponent.html" >UserComponent</a>
                                         </li>
                                 </ul>
                             </li>
                     
                     
                             <li class="chapter">
                                 <div class="simple">
                                     <span class="fa fa-file-code-o"></span>
                                     <span>Classes</span>
                                     <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                             data-target="#classes-links"
                     ></span>
                                 </div>
                                 <ul class="links collapse in"
                                         id="classes-links"
                     >
                                         <li class="link">
                                             <a href="../classes/Address.html" >Address</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/AuthActions.html" >AuthActions</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/CheckoutActions.html" >CheckoutActions</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/Classification.html" >Classification</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/Image.html" >Image</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/LightOrder.html" >LightOrder</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/LineItem.html" >LineItem</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/OptionType.html" >OptionType</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/OptionValue.html" >OptionValue</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/Order.html" >Order</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/Payment.html" >Payment</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/PaymentMode.html" >PaymentMode</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/Product.html" >Product</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/ProductActions.html" >ProductActions</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/ProductProperty.html" >ProductProperty</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/SearchActions.html" >SearchActions</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/Taxon.html" >Taxon</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/User.html" >User</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/UserActions.html" >UserActions</a>
                                         </li>
                                         <li class="link">
                                             <a href="../classes/Variant.html" >Variant</a>
                                         </li>
                                 </ul>
                             </li>
                     
                             <li class="chapter">
                                 <div class="simple">
                                     <span class="fa fa-long-arrow-down"></span>
                                     <span>Injectables</span>
                                     <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                             data-target="#injectables-links"
                     ></span>
                                 </div>
                                 <ul class="links collapse in"
                                         id="injectables-links"
                     >
                                         <li class="link">
                                             <a href="../injectables/AddressService.html" >AddressService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/AuthService.html" >AuthService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/AuthenticationEffects.html" >AuthenticationEffects</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/CanActivateViaAuthGuard.html" >CanActivateViaAuthGuard</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/CheckoutEffects.html" >CheckoutEffects</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/CheckoutService.html" >CheckoutService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/FilterPipe.html" >FilterPipe</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/HttpService.html" >HttpService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/PaymentService.html" >PaymentService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/ProductEffects.html" >ProductEffects</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/ProductService.html" >ProductService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/UserEffects.html" >UserEffects</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/UserService.html" >UserService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/VariantParserService.html" >VariantParserService</a>
                                         </li>
                                         <li class="link">
                                             <a href="../injectables/VariantRetriverService.html" >VariantRetriverService</a>
                                         </li>
                                 </ul>
                             </li>
                     
                             <li class="chapter">
                                 <div class="simple">
                                     <span class="fa fa-info"></span>
                                     <span>Interfaces</span>
                                     <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                             data-target="#interfaces-links"
                     ></span>
                                 </div>
                                 <ul class="links collapse in"
                                         id="interfaces-links"
                     >
                                         <li class="link">
                                             <a href="../interfaces/AppState.html" >AppState</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/AuthState.html" >AuthState</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/CheckoutState.html" >CheckoutState</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/CurrentSelectedOptionsType.html" >CurrentSelectedOptionsType</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/OptionTypesHash.html" >OptionTypesHash</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/ProductState.html" >ProductState</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/SearchState.html" >SearchState</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/Taxonomy.html" >Taxonomy</a>
                                         </li>
                                         <li class="link">
                                             <a href="../interfaces/UserState.html" >UserState</a>
                                         </li>
                                 </ul>
                             </li>
                     
                             <li class="chapter">
                                 <div class="simple">
                                     <span class="fa fa-plus"></span>
                                     <span>Pipes</span>
                                     <span class="menu-toggler fa fa-angle-up" data-toggle="collapse"
                                             data-target="#pipes-links"
                     ></span>
                                 </div>
                                 <ul class="links collapse in"
                                         id="pipes-links"
                     >
                                         <li class="link">
                                             <a href="../pipes/FilterPipe.html" >FilterPipe</a>
                                         </li>
                                         <li class="link">
                                             <a href="../pipes/HumanizePipe.html" >HumanizePipe</a>
                                         </li>
                                         <li class="link">
                                             <a href="../pipes/KeysPipe.html" >KeysPipe</a>
                                         </li>
                                 </ul>
                             </li>
                     
                     
                             <li class="chapter">
                                 <a data-type="chapter-link" href="../miscellaneous.html" ><span class="fa fa-cubes"></span>Miscellaneous</a>
                             </li>
                     
                             <li class="chapter">
                                 <a data-type="chapter-link" href="../coverage.html" ><span class="fa fa-tasks"></span>Documentation coverage</a>
                             </li>
                     
                             <li class="divider"></li>
                             <li class="copyright">
                                     Documentation generated using <a href="https://compodoc.github.io/website/" target="_blank">
                                                 <img src="..//images/compodoc-vectorise.svg" class="img-responsive">
                                     </a>
                             </li>
                     
                         </ul>
                     
                     </nav>
                 </div>
                 <div class="content component">
                     <div class="content-data">
  
  
  <ol class="breadcrumb">
    <li>Components</li>
    <li>NotificationComponent</li>
  </ol>
  
  <ul class="nav nav-tabs" role="tablist">
      <li class="active">
          <a href="#infos" id="infos-tab" role="tab" data-toggle="tab" data-link="infos">Infos</a>
      </li>
  
      <li>
          <a href="#source" role="tab" id="source-tab" data-toggle="tab" data-link="source">Source</a>
      </li>
  
      <li>
          <a href="#templateData" role="tab" id="templateData-tab" data-toggle="tab" data-link="template">Template</a>
      </li>
      <li>
          <a href="#tree" role="tab" id="tree-tab" data-toggle="tab" data-link="dom-tree">DOM Tree</a>
      </li>
  </ul>
  
  <div class="tab-content">
      <div class="tab-pane fade active in" id="infos"><p class="comment">
      <h3>File</h3>
  </p>
  <p class="comment">
      <code>src/app/shared/components/notification/notification.component.ts</code>
  </p>
  
  
  
      <p class="comment">
          <h3>Implements</h3>
      </p>
      <p class="comment">
                  <code><a href="https://angular.io/docs/ts/latest/api/core/index/OnInit-interface.html" target="_blank" >OnInit</a></code>
                  <code><a href="https://angular.io/docs/ts/latest/api/core/index/OnDestroy-interface.html" target="_blank" >OnDestroy</a></code>
      </p>
  
  
  <section>
      <h3>Metadata</h3>
      <table class="table table-sm table-hover">
          <tbody>
  
  
  
  
  
  
  
  
  
  
  
  
              <tr>
                  <td class="col-md-3">selector</td>
                  <td class="col-md-9"><code>app-notification</code></td>
              </tr>
  
              <tr>
                  <td class="col-md-3">styleUrls</td>
                  <td class="col-md-9"><code>notification.component.scss</code></td>
              </tr>
  
  
  
              <tr>
                  <td class="col-md-3">templateUrl</td>
                  <td class="col-md-9"><code>./notification.component.html</code></td>
              </tr>
  
  
          </tbody>
      </table>
  </section>
  
  
  
      <section>
          <h3 id="constructor">Constructor</h3>
              <table class="table table-sm table-bordered">
                  <tbody>
                      <tr>
                          <td class="col-md-4">
                              <code>constructor(httpInterceptor: <a href="../injectables/HttpService.html">HttpService</a>)</code>
                          </td>
                      </tr>
                          <tr>
                              <td class="col-md-4">
                                  <div class="io-line">Defined in <a href="" data-line="13" class="link-to-prism">src/app/shared/components/notification/notification.component.ts:13</a></div>
                              </td>
                          </tr>
      
                  </tbody>
              </table>
      </section>
  
      <section>
          
              <h3 id="methods">
                  Methods
              </h3>
              <table class="table table-sm table-bordered">
                  <tbody>
                      <tr>
                          <td class="col-md-4">
                              <b> ngOnInit</b>
                          </td>
                      </tr>
                      <tr>
                          <td class="col-md-4">
      <code>ngOnInit()</code>
                          </td>
                      </tr>
      
                          <tr>
                              <td class="col-md-4">
                                  <div class="io-line">Defined in <a href="" data-line="21" class="link-to-prism">src/app/shared/components/notification/notification.component.ts:21</a></div>
                              </td>
                          </tr>
      
                      <tr>
                          <td class="col-md-4">
      
                                  <div class="io-description">
                                      <b>Returns: </b>    <code>void</code>
      
                                  </div>
                          </td>
                      </tr>
                  </tbody>
              </table>
              <table class="table table-sm table-bordered">
                  <tbody>
                      <tr>
                          <td class="col-md-4">
                              <b> ngOnDestroy</b>
                          </td>
                      </tr>
                      <tr>
                          <td class="col-md-4">
      <code>ngOnDestroy()</code>
                          </td>
                      </tr>
      
                          <tr>
                              <td class="col-md-4">
                                  <div class="io-line">Defined in <a href="" data-line="24" class="link-to-prism">src/app/shared/components/notification/notification.component.ts:24</a></div>
                              </td>
                          </tr>
      
                      <tr>
                          <td class="col-md-4">
      
                                  <div class="io-description">
                                      <b>Returns: </b>    <code>void</code>
      
                                  </div>
                          </td>
                      </tr>
                  </tbody>
              </table>
      </section>
  
      <section>
          
              <h3 id="inputs">
                  Properties
              </h3>
              <table class="table table-sm table-bordered">
                  <tbody>
                      <tr>
                          <td class="col-md-4">
                              <b> loading</b>
                          </td>
                      </tr>
                      <tr>
                          <td class="col-md-4">
                              <code>loading:     <code>any</code>
      </bcode>
                          </td>
                      </tr>
                          <tr>
                              <td class="col-md-4">
                                  <div class="io-line">Defined in <a href="" data-line="12" class="link-to-prism">src/app/shared/components/notification/notification.component.ts:12</a></div>
                              </td>
                          </tr>
                  </tbody>
              </table>
              <table class="table table-sm table-bordered">
                  <tbody>
                      <tr>
                          <td class="col-md-4">
                              <b> notiSubs</b>
                          </td>
                      </tr>
                      <tr>
                          <td class="col-md-4">
                              <code>notiSubs:     <code>Subscription</code>
      </bcode>
                          </td>
                      </tr>
                          <tr>
                              <td class="col-md-4">
                                  <div class="io-line">Defined in <a href="" data-line="13" class="link-to-prism">src/app/shared/components/notification/notification.component.ts:13</a></div>
                              </td>
                          </tr>
                  </tbody>
              </table>
      </section>
  </div>
  
  
      <div class="tab-pane fade tab-source-code" id="source">
          <pre class="line-numbers"><code class="language-typescript">import { Component, OnInit, OnDestroy } from &#x27;@angular/core&#x27;;
  import { Observable } from &#x27;rxjs/Observable&#x27;;
  import { Subscription } from &#x27;rxjs/Subscription&#x27;;
  import { HttpService } from &#x27;../../../core/services/http&#x27;;
  
  @Component({
    selector: &#x27;app-notification&#x27;,
    templateUrl: &#x27;./notification.component.html&#x27;,
    styleUrls: [&#x27;./notification.component.scss&#x27;]
  })
  export class NotificationComponent implements OnInit, OnDestroy {
    loading: any;
    notiSubs: Subscription;
  
    constructor(private httpInterceptor: HttpService) {
      this.notiSubs &#x3D; this.httpInterceptor.loading.subscribe(
        data &#x3D;&gt; this.loading &#x3D; data
      );
    }
  
    ngOnInit() {
    }
  
    ngOnDestroy() {
      // this.notiSubs.unsubscribe();
    }
  
  }
  </code></pre>
      </div>
  
      <div class="tab-pane fade" id="templateData">
          <pre class="line-numbers"><code class="language-html">&lt;div class&#x3D;&quot;notify-container in&quot; *ngIf&#x3D;&quot;loading.hasError&quot;&gt;
    &lt;div class&#x3D;&quot;notify-error notify-content&quot;&gt;
      &lt;div class&#x3D;&quot;notify-error-message&quot;&gt;
        &lt;span class&#x3D;&quot;notify-icon&quot;&gt;!&lt;/span&gt;
        &lt;p class&#x3D;&quot;notify-icon-text&quot;&gt;
          {{loading.hasMsg}}
        &lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
      </div>
  
      <div class="tab-pane fade" id="tree">
          <div id="tree-container"></div>
          <div class="tree-legend">
              <div class="title">
                  <b>Legend</b>
              </div>
              <div>
                  <div class="color htmlelement"></div><span>Html element</span>
              </div>
              <div>
                  <div class="color component"></div><span>Component</span>
              </div>
              <div>
                  <div class="color directive"></div><span>Html element with directive</span>
              </div>
          </div>
      </div>
  </div>
  
  <script src="../js/libs/vis.min.js"></script>
  <script src="../js/libs/htmlparser.js"></script>
  <script src="../js/libs/deep-iterator.js"></script>
  <script>
          var COMPONENT_TEMPLATE = '<div><div class="notify-container in" *ngIf="loading.hasError">  <div class="notify-error notify-content">    <div class="notify-error-message">      <span class="notify-icon">!</span>      <p class="notify-icon-text">        {{loading.hasMsg}}      </p>    </div>  </div></div></div>'
      var COMPONENTS = [{'name': 'AddAddressComponent', 'selector': 'app-add-address'},{'name': 'AddressComponent', 'selector': 'app-address'},{'name': 'AddressesComponent', 'selector': 'app-addresses'},{'name': 'AppComponent', 'selector': 'app-root'},{'name': 'BreadcrumbComponent', 'selector': 'app-breadcrumb'},{'name': 'CartComponent', 'selector': 'app-cart'},{'name': 'CashOnDeliveryComponent', 'selector': 'app-cash-on-delivery'},{'name': 'CheckoutFooterComponent', 'selector': 'app-checkout-footer'},{'name': 'CheckoutHeaderComponent', 'selector': 'app-checkout-header'},{'name': 'ContentComponent', 'selector': 'app-content'},{'name': 'ContentHeaderComponent', 'selector': 'app-content-header'},{'name': 'CreditCardComponent', 'selector': 'app-credit-card'},{'name': 'CustomizeComponent', 'selector': 'app-customize'},{'name': 'DeliveryAddressComponent', 'selector': 'app-delivery-address'},{'name': 'DeliveryOptionsComponent', 'selector': 'app-delivery-options'},{'name': 'EmptyCartComponent', 'selector': 'app-empty-cart'},{'name': 'FilterComponent', 'selector': 'app-filter'},{'name': 'FilterSummaryComponent', 'selector': 'app-filter-summary'},{'name': 'FooterComponent', 'selector': 'app-footer'},{'name': 'HeaderComponent', 'selector': 'app-header'},{'name': 'HomeComponent', 'selector': 'app-home'},{'name': 'LineItemComponent', 'selector': 'app-line-item'},{'name': 'LineItemListComponent', 'selector': 'app-line-item-list'},{'name': 'LoadingIndicatorComponent', 'selector': 'app-loading-indicator'},{'name': 'LoginComponent', 'selector': 'app-login'},{'name': 'NetBankingComponent', 'selector': 'app-net-banking'},{'name': 'NotificationComponent', 'selector': 'app-notification'},{'name': 'OrderDetailComponent', 'selector': 'app-order-detail'},{'name': 'OrderListItemComponent', 'selector': 'app-order-list-item'},{'name': 'OrderTotalSummaryComponent', 'selector': 'app-order-total-summary'},{'name': 'OrdersComponent', 'selector': 'app-orders'},{'name': 'OverviewComponent', 'selector': 'app-overview'},{'name': 'PaymentComponent', 'selector': 'app-payment'},{'name': 'PaymentModeComponent', 'selector': 'app-payment-mode'},{'name': 'PaymentModesListComponent', 'selector': 'app-payment-modes-list'},{'name': 'ProductComponent', 'selector': 'app-product'},{'name': 'ProductDescriptionComponent', 'selector': 'app-product-description'},{'name': 'ProductDetailPageComponent', 'selector': 'app-product-detail-page'},{'name': 'ProductDetailsComponent', 'selector': 'app-product-details'},{'name': 'ProductImagesComponent', 'selector': 'app-image-container'},{'name': 'ProductListComponent', 'selector': 'app-product-list'},{'name': 'ProductListItemComponent', 'selector': 'app-product-list-item'},{'name': 'ProductPriceInfoComponent', 'selector': 'app-product-price-info'},{'name': 'ProductVariantsComponent', 'selector': 'app-product-variants'},{'name': 'ProfileDropdownComponent', 'selector': 'app-profile-dropdown'},{'name': 'ReturnListItemComponent', 'selector': 'app-return-list-item'},{'name': 'ReturnsComponent', 'selector': 'app-returns'},{'name': 'SignUpComponent', 'selector': 'app-sign-up'},{'name': 'TaxonsComponent', 'selector': 'app-taxons'},{'name': 'UserComponent', 'selector': 'app-user'}];
      var DIRECTIVES = [];
      var ACTUAL_COMPONENT = {'name': 'NotificationComponent'};
  </script>
  <script src="../js/tree.js"></script>
  
  
  
  
  
  
  
  
  
                     </div><div class="search-results">
      <div class="has-results">
          <h1 class="search-results-title"><span class='search-results-count'></span> results matching "<span class='search-query'></span>"</h1>
          <ul class="search-results-list"></ul>
      </div>
      <div class="no-results">
          <h1 class="search-results-title">No results matching "<span class='search-query'></span>"</h1>
      </div>
  </div>
  </div>
             </div>
         </div>
  
         <script src="../js/libs/bootstrap-native.js"></script>
  
         <script src="../js/libs/es6-shim.min.js"></script>
         <script src="../js/libs/EventDispatcher.js"></script>
         <script src="../js/libs/promise.min.js"></script>
         <script src="../js/libs/zepto.min.js"></script>
  
         <script src="../js/compodoc.js"></script>
  
         <script>var COMPODOC_CURRENT_PAGE_DEPTH = 1;</script>
  
         <script src="../js/search/search.js"></script>
         <script src="../js/search/lunr.min.js"></script>
         <script src="../js/search/search-lunr.js"></script>
  
         <script src="../js/tabs.js"></script>
         <script src="../js/menu.js"></script>
         <script src="../js/libs/prism.js"></script>
         <script src="../js/sourceCode.js"></script>
         <script src="../js/search/search_index.js"></script>
  
      </body>
  </html>
  