import { PokemonService } from "./pokemon/pokemon.service";
export class ListComponent implements OnInit {
pokemonList;
constructor(private pokemonService: PokemonService) {}
ngOnInit() {
this.pokemonService.list().then((data) => {
this.pokemonList = data;
});
}
}
<ScrollView>
<FlexboxLayout class="container">
<Image *ngFor="let pokemon of pokemonList"
[src]="pokemon.sprite"
></Image>
</FlexboxLayout>
</ScrollView>
.container {
flex-wrap: wrap;
justify-content: space-around;
}
(tap)="onTap($event, pokemon)"
import { RouterExtensions } from "nativescript-angular/router";
onTap(event, pokemon) {
this.router.navigate(["/detail", pokemon], {
});
}
transition: {
name: "curlUp",
duration: 500
}
<FlexboxLayout justifyContent="center">
<Image [src]="pokemon.sprite"></Image>
</FlexboxLayout>
import * as SocialShare from "nativescript-social-share";
<ActionItem text="Share" (tap)="share(event, pokemon)" android.systemIcon="ic_menu_share_holo_dark" ios.systemIcon="9" ios.position="right"></ActionItem>
share(event, pokemon) {
SocialShare.shareImage(pokemon.sprite);
}
var explosion = require("nativescript-explosionfield");
explosion.explode(event.view);