HTML binding Angular 4

Question

HTML binding Angular 4

Navigation

#1 by (0 votes)

0

Good afternoon, I need help with Angular 4

I have the following method:

import { Component, OnInit, Input, Output } from '@angular/core';
import { Remedy } from '../remedy/remedy.model'
import { RemedysService } from '../remedys.service'
import { ActivatedRoute } from '@angular/router'
import { Observable } from 'rxjs/Observable'

@Component({
    selector: 'gmr-remedy-details',
    templateUrl: './remedy-details.component.html'
})
export class RemedyDetailsComponent implements OnInit {

    remedy: Remedy

    constructor(private remedysService: RemedysService, private route: ActivatedRoute) { }

    ngOnInit() {
        this.remedysService.remedyByMenuId(this.route.snapshot.params['id'])
            .subscribe(remedy => this.remedy = remedy)
        console.log('Parametro : ${this.route.snapshot.params['id']}, Remédio ${this.remedy}')
    }
}

To be placed in a template:

<dl class="col-sm-9 col-xs-12">
    <dt>Categoria</dt>
    <dd>{{remedy?.des_category}}</dd>
    <dt>Dosagem</dt>
    <dd>{{remedy?.des_dosage}}</dd>
    <dt>Descrição</dt>
    <dd>{{remedy?.des_description}}</dd>
    <a href="#" [routerLink]="['/remedy-register']">
        <h4>Cadastrar novo remédio</h4>
    </a>
</dl>

Web service search service:

remedyByMenuId(id: string): Observable<Remedy> {
    return this.http.get('${GMR_API}/api/remedys/remedysMenu/${id}')
        .map(response => response.json())
        .catch(ErrorHandler.handleError)
}

Note: the URL works because I use it for other services and it works normally.

But I can not get Bind for values to appear in HTML, and check in the browser for the debug tool the object with all web service values being returned normally to something I'm doing wrong?

html typescript angular binding

asked by anonymous 16.01.2018 / 20:35

1 answer

Doubts about the data type sql [duplicate] How to protect the source code?

score 0 · Accepted Answer

As I was:

ngOnInit() {
        this.remedysService.remedyByMenuId(this.route.snapshot.params['id'])
            .subscribe(remedy => this.remedy = remedy)
        console.log('Parametro : ${this.route.snapshot.params['id']}, Remédio ${this.remedy}')
    }
}

Resolution:

  this.remedysService.remedyByMenuId(this.route.snapshot.params['id'])
    .subscribe(response => {
          this.remedy = {des_name : response[0].des_name}
          console.log(this.remedy)
    })

The truth is that the return was coming as an array, after letting that part of the side deepen my knowledge and reanalyzed I realized that it returned in array form in the index [0] or it was enough to take the returns of this popular index in an object and bind that object.