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