0

Incluí dentro del menú sidebar un select que permite cambiar la propiedad, esto corresponde a un componente.

Por otra parte tengo otro componente que muestra los datos de esta propiedad, tengo una variable global que guarda estos datos.

El problema es que una vez que ya estoy en la vista de los datos si cambio la propiedad seleccionada los datos de la propiedad no se actualizan, he intentado gatillar la actualización desde el servicio pero no he tenido éxito.

Probablemente existe una forma correcta de generar esto y espero que alguien me la pueda explicar.

esta imagen de las vistas

//SERVICIO

import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { map } from 'rxjs/operators';
import { Observable } from 'rxjs/Observable';
import { GLOBAL } from './global';
import { Propiedad } from '../models/propiedad';
import { Plan } from '../models/plan';
import { Router } from '@angular/router';
import { Subject } from 'rxjs/Subject';


@Injectable()
export class PropiedadService {

  // pruebas
  private propiedadPrueba = new Subject<void>();
  public propiedadCambio$ = this.propiedadPrueba.asObservable();
  
  constructor(
    private _http: Http,
    private router: Router
  ) {
    this.url = GLOBAL.url;
  }
  
   getPropiedad(){
    return GLOBAL.propiedad;
  }

  setPropiedad(token, id: String) {
    this.buscarPropiedad(token, id).subscribe(
      response => {
        if (!response) {
          console.log('error al recuperar propiedad');
        } else {
          GLOBAL.propiedad = response;
          this.propiedadPrueba.next();
          this.router.navigate(['/karulover/propiedad']);
        }
      },
      error => {
        console.log(error);
      }
    )
  }

// componente Vista

import { Component, OnInit } from '@angular/core';
import { PropiedadService } from '../../services/propiedad.service';
import { LoginService } from '../../services/login.service';
import { Propiedad } from 'app/models/propiedad';

@Component({
  selector: 'app-propiedad-cliente',
  templateUrl: './propiedad-cliente.component.html',
  styleUrls: ['./propiedad-cliente.component.scss'],
  providers: [LoginService, PropiedadService]
})
export class PropiedadClienteComponent implements OnInit {
  token: any;
  identidad: any;
  propiedad: any;

  constructor(
    private _propiedadService: PropiedadService,
    private _loginService: LoginService
  ) { }

  ngOnInit() {
    this.token = this._loginService.getToken();
    this.identidad = this._loginService.getIdentidad();
    this.actualizarPropiedad();
    console.log(this.propiedad);

    this._propiedadService.propiedadCambio$.subscribe(() => {
      this.actualizarPropiedad();
    })
  }

  actualizarPropiedad() {
    this.propiedad = this._propiedadService.getPropiedad();
  }

}

// Componente sidebar

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { LoginService } from '../../services/login.service';
import { PropiedadService } from '../../services/propiedad.service';
import {MatOption} from '@angular/material';

declare const $: any;
declare interface RouteInfo {
  path: string;
  title: string;
  icon: string;
  class: string;
  rol: string;
}

@Component({
  selector: 'app-sidebar',
  templateUrl: './sidebar.component.html',
  styleUrls: ['./sidebar.component.css'],
  providers: [LoginService, PropiedadService]
})
export class SidebarComponent implements OnInit {
  menuItems: any[] = new Array();
  menuItems_temp: any[];
  roles: any[];
  identidad: any;
  token: any;
  propiedades: any;

  constructor(private router: Router, private _loginService: LoginService, private _propiedadService: PropiedadService ) {
    this.identidad = this._loginService.getIdentidad();
  }

  ngOnInit() {
    this.menu();
    this.identidad = this._loginService.getIdentidad();
    this.token = this._loginService.getToken();
    this.propiedadesUsuario();

  }

 
  cambioPropiedad(valor){
      // console.log(valor);
    this._propiedadService.setPropiedad(this.token, valor);
   
      // console.log(this._propiedadService.getPropiedad());
  }

3
  • Relacionada: es.stackoverflow.com/questions/176463/… el 28 dic. 2018 a las 16:24
  • No sé la relación entre los componentes, pero puedes hacer que la selección de una propiedad lance un evento que sea observado por PropiedadClienteComponent y esto provoque la carga. En el enlace que te he puesto tienes una idea general de cómo hacerlo. el 28 dic. 2018 a las 16:27
  • hola, gracias por tu respuesta, justamente he intentado realizar lo del evento observable pero no he logrado implementarlo. el 28 dic. 2018 a las 17:00

1 respuesta 1

0

Ya solucioné el tema con un Observable.

Mi error era que estaba incluyendo el servicio en los providers de módulos separados; una vez que incluí los servicios en los providers del app.module, todo funcionó correctamente.

1
  • 1
    Más bien debería borrar la pregunta o poner la solución, ya que nadie más ha respondido el 30 dic. 2018 a las 17:57

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.