When executing the code, it shows nothing.
auto.service.ts
import { Injectable, Component, NgModule } from '@angular/core';
import { Http , Response , Headers, HttpModule } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
@Injectable()
export class AutoService {
private uri = 'https://localhost:8443';//esta url esta buena, saco datos y todo.
constructor( private http: Http ) { }
getVersion(id): Observable<any[]> {
const headers = new Headers();
return this.http.get(this.uri + '/versions/' + id + '.json', {headers: headers}).map(res => res.json());
}
getPrecios(): Observable<any[]> {
const headers = new Headers();
return this.http.get(this.uri + '/precios.json', {headers: headers}).map(res => res.json());
}
}
auto-show.component.ts
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { AutoService } from '../auto.service';
@Component({
selector: 'app-auto-show',
encapsulation: ViewEncapsulation.None,
templateUrl: './auto-show.component.html',
styleUrls: ['./auto-show.component.css']
})
export class AutoShowComponent implements OnInit {
public version: any = [];
public precios: any = [];
public errorMesage: string;
public id: any = '';
public idVersion = this.route.snapshot.paramMap.get('id');
constructor(
private route: ActivatedRoute,
private router: Router,
private _autoService: AutoService
) { }
getVersion(idVersion) {
return this._autoService.getVersion(idVersion).subscribe(
data => {
this.version = data;
this.id = data['id'];
console.log(this.version.nombre);
console.log(this.id);
},
error => {
this.errorMesage = <any> error;
}
);
}
getPrecios() {
return this._autoService.getPrecios().subscribe(
data => this.precios = data, error => this.errorMesage = <any> error
);
}
ngOnInit() {
this.getVersion(this.idVersion);
this.getPrecios();
}
}
auto-show.component.html
<!-- Listing-detail-header -->
<section class="listing_detail_header">
<div class="container">
<div class="listing_detail_head white-text div_zindex row">
<div class="col-md-9">
<div class="col-md-12">
<h2>{{version.nombre ? version.nombre: "Sin Version"}}</h2>
</div>
<div class="car-location"><span><i class="fa fa-map-marker" aria-hidden="true"></i> 12250 F Garvey Ave South West Covina, CA 91791</span></div>
<div class="add_compare">
<div class="checkbox">
<input value="" id="compare14" type="checkbox">
<label for="compare14">Add to Compare</label>
</div>
<div class="share_vehicle">
<p>Share: <a href="#"><i class="fa fa-facebook-square" aria-hidden="true"></i></a> <a href="#"><i class="fa fa-twitter-square" aria-hidden="true"></i></a> <a href="#"><i class="fa fa-linkedin-square" aria-hidden="true"></i></a> <a href="#"><i class="fa fa-google-plus-square" aria-hidden="true"></i></a> </p>
</div>
</div>
</div>
<div *ngFor="let p of precios" class="col-md-3">
<div *ngIf="'/versions/' + id == p.version" class="price_info">
<p>$ {{p.valor ? p.valor: "Sin Valor"}}</p>
</div>
</div>
</div>
</div>
<div class="dark-overlay"></div>
</section>
<!-- /Listing-detail-header -->