Commit 45579b42 authored by prumde's avatar prumde

Removed components


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174379 ce508802-f39f-4f6c-b175-0d175dae99d5
parent cdfdb87b
/**
* Category Model
* {catCode, curRank, descr, shDescr, resourceUrl}
*/
export class Category {
constructor(
public catCode: string = '',
public descr: string = '',
public shDescr: string = '',
public curRank: string = '',
public catLink: string = '',
public resourceUrl: string = '') {
console.log('comp this.resourceUrl[' + this.resourceUrl + ']');
}
}
export class SubCategory {
constructor(
public scatCode: string = '',
public catCode: string = '',
public descr: string = '',
public shDescr: string = '',
public curRank: string = '',
public catLink: string = '',
public resourceUrl: string = '') {
console.log('comp this.resourceUrl[' + this.resourceUrl + ']');
}
}
export class Item {
public itemCode: string = '';
public descr: string = '';
public shDescr: string = '';
}
export const MockTrendings: Category[] = [
new Category('food', 'Kabab Special', 'Authentic Home Made recipe','',''),
new Category('tour', 'Into the blue', 'Scuba diving in deep blue ocean','',''),
new Category('festival', 'Holi Celebration 2017', 'Celebrate with your loved ones','',''),
new Category('food', 'Kabab Special', 'Authentic Home Made recipe','',''),
new Category('festival', 'Holi Celebration 2017', 'Celebrate with your loved ones','',''),
new Category('tour', 'Into the blue', 'Scuba diving in deep blue ocean','',''),
new Category('festival', 'Holi Celebration 2017', 'Celebrate with your loved ones','',''),
new Category('food', 'Kabab Special', 'Authentic Home Made recipe','',''),
new Category('tour', 'Into the blue', 'Scuba diving in deep blue ocean','','')
];
.categories-section {
padding: 0;
margin: 0;
padding-top: 100px;
padding-top: 50px;
background-color: #FFF;
}
.ecm-section-info {
padding: 10px;
}
.ecm-section-info-title {
font-size: 26px;
color: #444;
display: block;
}
.ecm-section-info-subhead {
font-size: 16px;
color: #888;
display: block;
}
.end {
padding-top: 15px;
padding-bottom: 50px;
}
.row.row-category {
max-width: 72rem;
}
\ No newline at end of file
<div *ngIf="categories">
<section class="categories-section">
<div class="row row-category">
<div class="ecm-section-info">
<span class="ecm-section-info-title">Categories</span>
<span class="ecm-section-info-subhead">Explore top Authentic Regional Foods, Outings, Celebrations around {{selectedPlace}}</span>
</div>
<div class="small-12 medium-6 large-4 column end "*ngFor="let _category of categories">
<ecm-card [category]="_category"></ecm-card>
</div>
<div></div>
</div>
</section>
</div>
import { Component, OnInit } from '@angular/core';
import { ECMCategoryService } from './ecm-category.service';
import { ECMCard } from '../ecm-card/card-model';
import { Category, SubCategory } from './category-model';
@Component({
selector: 'ecm-category',
templateUrl: './ecm-category.component.html',
styleUrls: ['./ecm-category.component.css'],
providers: [ECMCategoryService]
})
export class ECMCategoryComponent implements OnInit {
errorMessage: string;
selectedPlace = 'Mumbai';
categories: Category[];
constructor(public categoryService: ECMCategoryService) { }
ngOnInit() {
this.getCategories();
}
getCategories() {
this.categoryService.getCategories().subscribe(
categories => {
this.categories = categories;
console.log('comp categories[' + JSON.stringify( categories ) + '] \n this.categories[' + JSON.stringify( this.categories ) + ']');
},
error => {
this.errorMessage = <any>error;
console.log('comp errorMessage[' + this.errorMessage + ']');
});
}
}
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import { Category, SubCategory, Item } from '../ecm-category/category-model';
@Injectable()
export class ECMCategoryService {
private categoryUrl = '/ecm/service/category'; // URL to web service
constructor (private http: Http) {}
getCategories(): Observable<Category[]> {
let headers = new Headers( { 'Content-Type': 'application/json' });
let options = new RequestOptions( { headers: headers });
return this.http.get( this.categoryUrl, options )
.map( this.extractData )
.catch( this.handleError );
}
getSubCategories( catCode: string ): Observable<SubCategory[]> {
let subCategoriesUrl = this.categoryUrl + '/' + catCode + '/list';
let headers = new Headers( { 'Content-Type': 'application/json' });
let options = new RequestOptions( { headers: headers });
return this.http.get( subCategoriesUrl, options )
.map( this.extractData )
.catch( this.handleError );
}
getCategory (catCode : string): Observable<Category> {
let categoryUrl = this.categoryUrl + '/' + catCode;
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
return this.http.get(categoryUrl, options)
.map(this.extractData)
.catch(this.handleError);
}
getSubCategory (scatCode : string): Observable<SubCategory> {
let subCategoryUrl = this.categoryUrl + '/list/' + scatCode;
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
return this.http.get(subCategoryUrl, options)
.map(this.extractData)
.catch(this.handleError);
}
getItems (scatCode : string): Observable<Item[]> {
let itemsUrl = this.categoryUrl + '/itemlist/' + scatCode ;
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
return this.http.get(itemsUrl, options)
.map(this.extractData)
.catch(this.handleError);
}
private extractData(res: Response) {
let body = res.json();
console.log('extractData[' + JSON.stringify(body) + ']');
return body || { };
}
private handleError (error: Response | any) {
// In a real world app, we might use a remote logging infrastructure
let errMsg: string;
if (error instanceof Response) {
const body = error.json() || '';
const err = body.error || JSON.stringify(body);
errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
} else {
errMsg = error.message ? error.message : error.toString();
}
console.error('Service handleError:' + errMsg);
return Observable.throw(errMsg);
}
}
.subcategories-section {
padding: 0;
margin: 0;
padding-top: 100px;
padding-top: 50px;
background-color: #FFF;
}
.ecm-section-info {
padding: 10px;
}
.ecm-section-info-title {
font-size: 26px;
color: #444;
display: block;
}
.ecm-section-info-subhead {
font-size: 16px;
color: #888;
display: block;
}
.end {
padding-top: 15px;
padding-bottom: 50px;
}
.row.row-subcategory {
max-width: 72rem;
}
<div *ngIf="subcategories">
<section class="subcategories-section">
<div class="row row-subcategory">
<div class="ecm-section-info">
<span class="ecm-section-info-title">{{category.shDescr}}</span>
<span class="ecm-section-info-subhead">{{category.descr}}</span>
</div>
<div class="small-12 medium-6 large-4 column end "*ngFor="let _subcategory of subcategories">
<ecm-card [subcategory]="_subcategory"></ecm-card>
</div>
</div>
</section>
</div>
<div *ngIf="items">
<section class="subcategories-section">
<div class="row row-subcategory">
<div class="ecm-section-info">
<span class="ecm-section-info-title">{{subcategory.shDescr}}</span>
<span class="ecm-section-info-subhead">{{subcategory.descr}}</span>
</div>
<div class="small-12 medium-6 large-4 column end "*ngFor="let _item of items">
<ecm-item-caption [itemData]="_item"></ecm-item-caption>
</div>
</div>
</section>
</div>
import { Component, OnInit } from '@angular/core';
import { Item, SubCategory, Category } from './category-model';
import { ECMCategoryService } from './ecm-category.service';
import { Router, ActivatedRoute } from '@angular/router';
@Component({
selector: 'ecm-sub-category',
templateUrl: './ecm-sub-category.component.html',
styleUrls: ['./ecm-sub-category.component.css'],
providers: [ECMCategoryService]
})
export class EcmSubCategoryComponent implements OnInit {
private subcategories: SubCategory[];
private items: Item[];
private category : Category;
private subcategory : SubCategory;
constructor(private route: ActivatedRoute, private router:Router,public subcategoryService: ECMCategoryService) { }
ngOnInit() {
this.route.params.subscribe( params => {
//let id: number = +params['id']; // (+) converts string 'id' to a number
// In a real app: dispatch action to load the details here.
let viewType = params['type'];
let viewKey = params['key'];
console.log( 'ngOnInit viewType[' + viewType + ']viewKey[' + viewKey + ']' );
this.openView(viewType, viewKey);
});
}
openView(viewType:string, viewKey:string){
if( viewType == 'SUB_CATEGORY')
{
this.getCategory( viewKey );
}
else if( viewType == 'ITEMS')
{
this.getSubCategory( viewKey );
}
}
getCategory( catCode: string ) {
this.subcategoryService.getCategory( catCode ).subscribe(
category => {
this.category = category;
console.log( 'comp catCode[' + catCode + '] \n this.category[' + JSON.stringify( this.category ) + ']' );
this.getSubCategories( catCode );
},
);
}
getSubCategory( scatCode: string ) {
this.subcategoryService.getSubCategory( scatCode ).subscribe(
subcategory => {
this.subcategory = subcategory;
console.log( 'comp scatCode[' + scatCode + '] \n this.subcategory[' + JSON.stringify( this.subcategory ) + ']' );
this.getItems( scatCode );
},
);
}
getSubCategories( catCode: string ) {
this.subcategoryService.getSubCategories( catCode ).subscribe(
subcategories => {
this.subcategories = subcategories;
this.items = null;
console.log( 'comp catCode[' + catCode + '] \n this.subcategories[' + JSON.stringify( this.subcategories ) + ']' );
},
);
}
getItems( scatCode: string ) {
this.subcategoryService.getItems( scatCode ).subscribe(
items => {
this.items = items;
this.subcategories = null;
console.log( 'comp scatCode[' + scatCode + '] \n this.items[' + JSON.stringify( this.items ) + ']' );
},
);
}
}
.item-order{
display: none !important;
}
.caption-rating{
display: none;
}
.caption-3:hover .item-order,
.caption-3:active .item-order,
.caption-3:focus .item-order{
position: absolute;
margin: 0;
display: block !important;
z-index: 5;
bottom: 0;
background: mediumvioletred;
}
.caption {
display: inline-block;
position: relative;
margin: 10px;
min-height: 400px;
}
.caption img {
display: block;
max-width: 100%;
min-height: 344px;
min-height: 400px;
}
.caption-3 {
overflow: hidden;
background: #000;
background: #fff;
}
.caption-3 img {
-webkit-transition: opacity 0.3s ease-in-out;
-moz-transition: opacity 0.3s ease-in-out;
transition: opacity 0.3s ease-in-out;
}
.caption-3:hover img,
.caption-3:active img,
.caption-3:focus img {
opacity: 0.5;
}
.caption-3::after,
.caption-3::before {
position: absolute;
width: 100%;
color: #fff;
z-index: 1;
-webkit-transition: -webkit-transform 0.3s ease-in-out;
-moz-transition: -moz-transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out;
}
.caption-3::after {
content: attr(data-title);
top: 0;
height: 60px;
line-height: 60px;
padding-left: 10px;
background: #0083ab;
background: mediumvioletred;
font-size: 28px;
font-weight: 300;
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
transform: translateY(-100%);
}
.caption-3::before {
content: '...' attr(data-description) '...';
top: 60px;
height: calc( 100% - 60px );
background: #f27545;
background: transparent;
font-size: 14px;
padding: 20px;
-webkit-transform: translateY(100%);
-moz-transform: translateY(100%);
transform: translateY(100%);
}
.caption-3:hover::after,
.caption-3:hover::before,
.caption-3:active::after,
.caption-3:active::before,
.caption-3:focus::after,
.caption-3:focus::before {
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
transform: translateY(0%);
}
a img {
border: none;
}
.column-wrap {
clear: both;
}
.end {
padding-bottom: 25px;
}
<div *ngIf="itemData" class="column-wrap clearfix">
<div class="caption caption-3" attr.data-title="{{itemData.shDescr}}" attr.data-description="{{itemData.descr}}" >
<img src="/ecm/assets/images/items/{{itemData.itemCode}}.png" alt="Illustration of {{itemData.shDescr}}">
<div class="caption-rating">
<h5>
Current Rate: <b>{{currentRate}}</b>
</h5>
<ecm-rating [(ngModel)]="currentRate"
[max]="maxRateValue"
[readonly]="isRatingReadonly"
(onHover)="overStarDoSomething($event)"
(onLeave)="resetRatingStar($event)"
[titles]="['one','two','three']">
</ecm-rating>
<span class="label"
[ngClass]="{'label-warning': ratingPercent<30, 'label-info': ratingPercent>=30 && ratingPercent<70, 'label-success': ratingPercent>=70}"
[ngStyle]="{display: (overStar && !isRatingReadonly) ? 'inline' : 'none'}">
{{ratingPercent}}%
</span>
</div>
<button (click)='orderItem()' class="item-order button large expanded">Order Item</button>
</div>
</div>
import { Component, OnInit, ViewEncapsulation, Input } from '@angular/core';
import { Item } from '../ecm-category/category-model';
@Component({
selector: 'ecm-item-caption',
templateUrl: './ecm-item-caption.component.html',
styleUrls: ['./ecm-item-caption.component.css'],
encapsulation: ViewEncapsulation.None
})
export class EcmItemCaptionComponent implements OnInit {
//value used with custom icons demo above
//private rateValueExample1:number = 5;
//value used with custom icons demo above
//private rateValueExample2:number = 2;
//the maximum allowed value
private maxRateValue:number = 10;
//contains the current value entred by the user
private currentRate:number = 7; // @Input itemCurrRank
//make the rating component readonly
private isRatingReadonly:boolean = false;
private overStar:number;
private ratingPercent:number;
private ratingStatesItems:any = [
{stateOn: 'glyphicon-ok-sign', stateOff: 'glyphicon-ok-circle'},
{stateOn: 'glyphicon-heart', stateOff: 'glyphicon-star-empty'},
{stateOn: 'glyphicon-heart', stateOff: 'glyphicon-ban-circle'},
{stateOn: 'glyphicon-heart', stateOff: 'glyphicon-ban-circle'},
{stateOn: 'glyphicon-heart', stateOff: 'glyphicon-ban-circle'}
];
//reset the rating value to null
private resetRatingStar() {
this.overStar = null;
}
//call this method when over a star
private overStarDoSomething(value:number):void {
this.overStar = value;
this.ratingPercent = 100 * (value / this.maxRateValue);
};
@Input() itemData: Item;
@Input() itemCurrRank: number;
constructor() { }
ngOnInit() {
}
orderItem()
{
alert(this.itemData.itemCode);
}
}
import {
Component,
OnInit, Input, Output, HostListener,
Self, EventEmitter
} from '@angular/core';
import { ControlValueAccessor, NgModel } from '@angular/forms';
/*
Usage:
<h4 style="color: #00b0e8">Angular 2 Rating - Stars Example</h4>
<h5>Current Rate: <b>{{currentRate}}</b></h5>
<ecm-rating [(ngModel)]="currentRate" [max]="maxRateValue" [readonly]="isRatingReadonly"
(onHover)="overStarDoSomething($event)" (onLeave)="resetRatingStar($event)"
[titles]="['one','two','three']"></ecm-rating>
<span class="label"
[ngClass]="{'label-warning': ratingPercent<30, 'label-info': ratingPercent>=30 && ratingPercent<70, 'label-success': ratingPercent>=70}"
[ngStyle]="{display: (overStar && !isRatingReadonly) ? 'inline' : 'none'}">{{ratingPercent}}%</span>
<h4 style="color: #00b0e8">Angular 2 Rating With <b>Custom icons</b></h4>
<h5><b>(<i>Current Rate:</i> {{rateValueExample1}})</b></h5>
<div>
<ecm-rating [(ngModel)]="rateValueExample1" max="10" stateOn="glyphicon-heart"
stateOff="glyphicon-ok-circle"></ecm-rating>
</div>
<h4 style="color: #00b0e8">Angular 2 Rating With <b>Custom icons</b></h4>
<h5><b>(<i>Current Rate:</i> {{rateValueExample2}})</b></h5>
<div>
<ecm-rating [(ngModel)]="rateValueExample2" [ratingStates]="ratingStatesItems"></ecm-rating>
</div>
*/
@Component({
selector: 'ecm-rating[ngModel]',
template: `
<span (mouseleave)="reset()" (keydown)="onKeydown($event)" tabindex="0" role="slider" aria-valuemin="0" [attr.aria-valuemax]="range.length" [attr.aria-valuenow]="value">
<template ngFor let-r [ngForOf]="range" let-index="index" >
<span class="sr-only">({{ index < value ? '*' : ' ' }})</span>
<i (mouseenter)="enter(index + 1)" (click)="rate(index + 1)" class="glyphicon" [ngClass]="index < value ? r.stateOn : r.stateOff" [title]="r.title" ></i>
</template>
</span>
`
})
export class EcmItemRatingComponent implements ControlValueAccessor, OnInit {
@Input() private max:number;
@Input() private stateOn:string;
@Input() private stateOff:string;
@Input() private readonly:boolean;
@Input() private titles:Array<string>;
@Input() private ratingStates:Array<{stateOn:string, stateOff:string}>;
@Output() private onHover:EventEmitter<number> = new EventEmitter();
@Output() private onLeave:EventEmitter<number> = new EventEmitter();
private range:Array<any>;
private value:number;
private preValue:number;
@HostListener('keydown', ['$event'])
private onKeydown(event:KeyboardEvent) {
if ([37, 38, 39, 40].indexOf(event.which) === -1) {
return;
}
event.preventDefault();
event.stopPropagation();
let sign = event.which === 38 || event.which === 39 ? 1 : -1;
this.rate(this.value + sign);
}
constructor(@Self() public cd:NgModel) {
cd.valueAccessor = this;
}
ngOnInit() {
this.max = typeof this.max !== 'undefined' ? this.max : 5;
this.readonly = this.readonly === true;
this.stateOn = typeof this.stateOn !== 'undefined' ? this.stateOn : 'glyphicon-star';
this.stateOff = typeof this.stateOff !== 'undefined' ? this.stateOff : 'glyphicon-star-empty';
this.titles = typeof this.titles !== 'undefined' && this.titles.length > 0 ? this.titles : ['one', 'two', 'three', 'four', 'five'];
this.range = this.buildTemplateObjects(this.ratingStates, this.max);
}
writeValue(value:number) {
if (value % 1 !== value) {
this.value = Math.round(value);
this.preValue = value;
return;
}
this.preValue = value;
this.value = value;
}
private buildTemplateObjects(ratingStates:Array<any>, max:number) {
ratingStates = ratingStates || [];
let count = ratingStates.length || max;
let result:any[] = [];
for (let i = 0; i < count; i++) {
result.push(Object.assign({
index: i,
stateOn: this.stateOn,
stateOff: this.stateOff,
title: this.titles[i] || i + 1
}, ratingStates[i] || {}));
}
return result;
}
private rate(value:number) {
if (!this.readonly && value >= 0 && value <= this.range.length) {
this.writeValue(value);
this.cd.viewToModelUpdate(value);
}
}
private enter(value:number) {
if (!this.readonly) {
this.value = value;
this.onHover.emit(value);
}
}
private reset() {
this.value = this.preValue;
this.onLeave.emit(this.value);
}
onChange = (_:any) => {
};
onTouched = () => {
};
registerOnChange(fn:(_:any) => {}):void {
this.onChange = fn;
}
registerOnTouched(fn:() => {}):void {
this.onTouched = fn;
}
}
.trending-section {
padding-top: 50px;
height: 650px;
background-color: #F2F2F2;
}
.ecm-section-info {
padding: 10px;
max-width: 72rem;
margin-left: auto;
margin-right: auto;
}
.ecm-section-info-title {
font-size: 26px;
color: #444;
display: block;
}
.ecm-section-info-subhead {
font-size: 16px;
color: #888;
display: block;
}
.end {
padding-top: 15px;
padding-bottom: 50px;
}
.ecm-slider-container {
position: absolute;
width: 100%;
max-width: 100%;
left: 0;
right: 0;
}
.slide-card {
padding: 10px;
}
\ No newline at end of file
<div *ngIf="trends_slides">
<section class="trending-section">
<div class="row">
<div class="ecm-section-info">
<span class="ecm-section-info-title">Currently Trending</span>
<span class="ecm-section-info-subhead">Explore top Authentic Regional Foods, Outings, Celebrations around {{selectedPlace}},based on trends.</span>
</div>
<div class="large column end ecm-slider-container">
<ngb-carousel>
<template ngbSlide *ngFor="let _card_slides of trends_slides">
<div *ngFor="let _card of _card_slides" class="slide-card">
<ecm-card [card]="_card"></ecm-card>
</div>
</template>
</ngb-carousel>
</div>
</div>
</section>
</div>
\ No newline at end of file
import { Component, OnInit } from '@angular/core';
import { ECMTrendingService } from './ecm-trending.service';
import { ECMCard } from '../ecm-card/card-model';
import { Category } from '../ecm-category/category-model';
@Component({
selector: 'ecm-trend',
templateUrl: './ecm-trend.component.html',
styleUrls: ['./ecm-trend.component.css'],
providers: [ECMTrendingService]
})
export class ECMTrendComponent implements OnInit {
trends_slides: ECMCard[][];
cardsPerSlide: number = 3;
selectedPlace = 'Mumbai';
trends: Category[];
trends_cards: ECMCard[];
constructor(public trendingService: ECMTrendingService) { }
getTrends(): void {
this.trendingService.getTrending().then(trends => {
this.trends = trends;
this.trends_cards = [];
this.trends_slides = [];
for ( let i = 0, j = 0; i < this.cardsPerSlide && j < this.trends.length ; ++i, ++j) {
let img = '/ecm/assets/images/category/' + this.trends[j].catCode + '.png';
let info_img = '/ecm/assets/images/category/' + this.trends[j].catCode + '_icon.png';
let info_title = this.trends[j].descr;
let info_subhead = this.trends[j].shDescr;
this.trends_cards.push( new ECMCard( img, info_img, info_title, info_subhead, false ) );
//console.log('i[' + i + ']j[' + j + ']cardsPerSlide[' + this.cardsPerSlide + ']');
if ( j < this.trends.length && i === this.cardsPerSlide - 1 ) {
//console.log('i[' + i + ']j[' + j + ']cardsPerSlide[' + this.cardsPerSlide + ']' + this.trends.length);
this.trends_slides.push(this.trends_cards);
this.trends_cards = [];
i = -1;
}
}
if ( this.trends_cards.length > 0 ) {
this.trends_slides.push(this.trends_cards);
}
}
);
}
ngOnInit() {
this.getTrends();
}
}
import { Injectable } from '@angular/core';
import { Category, MockTrendings } from '../ecm-category/category-model';
@Injectable()
export class ECMTrendingService {
getTrending(): Promise<Category[]> {
return Promise.resolve(MockTrendings);
}
getTrendingSlowly(): Promise<Category[]> {
return new Promise(resolve => {
// Simulate server latency with 2 second delay
setTimeout(() => resolve(this.getTrending()), 2000);
});
}
constructor() { }
}
.categories-section {
padding: 0;
margin: 0;
padding-top: 100px;
background-color: #FFF;
}
.ecm-section-info {
padding: 10px;
}
.ecm-section-info-title {
font-size: 26px;
color: #444;
display: block;
}
.ecm-section-info-subhead {
font-size: 16px;
color: #888;
display: block;
}
.end {
padding-top: 15px;
padding-bottom: 50px;
}
.row.row-category {
max-width: 72rem;
}
\ No newline at end of file
<div *ngIf="subcategories">
<section class="subcategories-section">
<div class="row row-subcategory">
<div class="ecm-section-info">
<span class="ecm-section-info-title">Sub Categories</span>
<span class="ecm-section-info-subhead">Explore top Authentic Regional Foods, Outings, Celebrations around {{selectedPlace}}</span>
</div>
<div class="small-12 medium-6 large-4 column end "*ngFor="let _subcategory of subcategories">
<ecm-card [subcategory]="_subcategory"></ecm-card>
</div>
</div>
</section>
</div>
import { Component, OnInit } from '@angular/core';
import { SubCategory } from '../ecm-category/category-model';
import { ECMCategoryService } from '../ecm-category/ecm-category.service';
import { Router, ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-view',
templateUrl: './view.component.html',
styleUrls: ['./view.component.css'],
providers: [ECMCategoryService]
})
export class ViewComponent implements OnInit {
public catCode: any;
constructor(private route: ActivatedRoute, private router:Router,public subcategoryService: ECMCategoryService) { }
ngOnInit() {
{
this.route.params.subscribe(params => {
//let id: number = +params['id']; // (+) converts string 'id' to a number
// In a real app: dispatch action to load the details here.
this.catCode = params['catCode'];
console.log( 'ngOnInit catCode[' + this.catCode + ']');
});
}
this.getSubCategories(this.catCode);
window.scrollTo(0, 600);
console.log("done scroll");
}
subcategories: SubCategory[];
getSubCategories(scatCode : string) {
this.subcategoryService.getSubCategories(scatCode).subscribe(
subcategories => {
this.subcategories = subcategories;
console.log('comp subcategories[' + JSON.stringify( subcategories ) + '] \n this.subcategories[' + JSON.stringify( this.subcategories ) + ']');
},
);
}}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment