src/app/pages/tokens/token-details/token-details.component.ts
| changeDetection | ChangeDetectionStrategy.OnPush |
| selector | app-token-details |
| styleUrls | ./token-details.component.scss |
| templateUrl | ./token-details.component.html |
Properties |
Methods |
constructor(route: ActivatedRoute, tokenService: TokenService)
|
|||||||||
|
Parameters :
|
| ngOnInit |
ngOnInit()
|
|
Returns :
void
|
| token |
Type : Token
|
import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
import {ActivatedRoute, Params} from '@angular/router';
import {TokenService} from '@app/_services';
import {first} from 'rxjs/operators';
import {Token} from '../../../_models';
@Component({
selector: 'app-token-details',
templateUrl: './token-details.component.html',
styleUrls: ['./token-details.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class TokenDetailsComponent implements OnInit {
token: Token;
constructor(
private route: ActivatedRoute,
private tokenService: TokenService
) {
this.route.paramMap.subscribe((params: Params) => {
this.tokenService.getTokenBySymbol(params.get('id')).pipe(first()).subscribe(res => {
this.token = res;
});
});
}
ngOnInit(): void {
}
}
<!-- Begin page -->
<div class="wrapper">
<app-sidebar></app-sidebar>
<!-- ============================================================== -->
<!-- Start Page Content here -->
<!-- ============================================================== -->
<div id="content">
<app-topbar></app-topbar>
<!-- Start Content-->
<div class="container-fluid text-center" appMenuSelection>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a routerLink="/home">Home</a></li>
<li class="breadcrumb-item"><a routerLink="/tokens">Tokens</a></li>
<li class="breadcrumb-item active" aria-current="page">{{token.name}}</li>
</ol>
</nav>
<div class="col-md-6 center-body">
<div class="card">
<mat-card-title class="card-header">
Token
</mat-card-title>
<div class="card-body">
<div>
<span><strong>Name:</strong> {{token.name}}</span>
</div>
<div>
<span><strong>Symbol:</strong> {{token.symbol}}</span>
</div>
<div>
<span><strong>Address:</strong> {{token.address}}</span>
</div>
<div>
<span><strong>Details:</strong> A community inclusive currency for trading among lower to middle income societies.</span>
</div>
<div>
<span><strong>Supply:</strong> {{token.supply | tokenRatio}}</span>
</div><br>
<div>
<h2>Reserve</h2>
<div>
<span><strong>Weight:</strong> {{token.reserveRatio}}</span>
</div>
<div>
<span><strong>Owner:</strong> {{token.owner}}</span>
</div>
</div>
</div>
</div>
</div>
</div>
<app-footer appMenuSelection></app-footer>
</div>
<!-- ============================================================== -->
<!-- End Page content -->
<!-- ============================================================== -->
</div>
./token-details.component.scss