Thursday, 25 January 2018

Passing Data To Component in Agular2 With Using Service

********************Create First Service*************

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';

@Injectable()
export class ProgressSpinner {
public _subject = new Subject<boolean>();
public event = this._subject.asObservable();

public SpinnerLoader(data: any) {
this._subject.next(data);
}
}

Create Object in AppComponent

import { Component } from '@angular/core';
import { alertservice, ProgressSpinner } from './shared'
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
loading: boolean = false;
constructor(public _ProgressSpinner: ProgressSpinner) {
_ProgressSpinner.event.subscribe((data) => { this.loading = data });

}
}
***************Second Component***************
import { Component, OnInit, ViewEncapsulation, ElementRef } from '@angular/core'
import { MenuItem, Message, Shape_Master, Shape_Col } from '../../shared'
import { DepartmentGroupervice, GenericClass, Pagination, ProgressSpinner } from '../../shared'
import { ConfirmationService, GrowlModule } from 'primeng/primeng';

@Component({
selector: 'app-shape',
templateUrl: './shape.component.html',
styleUrls: ['./shape.component.css']
})
export class ShapeComponent implements OnInit {

constructor( private _ProgressSpinner: ProgressSpinner) {
this._ProgressSpinner.SpinnerLoader(false);

}
}

No comments:

Post a Comment

Row based styling for Primeng DataTable using Angualr 2,4

------------------------------------Component.Html---------------- < p -dataTable id = "Tbl" [ rowStyleClass ]= " Fu...