andrucz/ionic2-rating

Isn't updating the rate value

felipelopes6 opened this issue · 17 comments

When I set the rootPage the EvaluateComponent (Component that have the rating module) in my app.component that works fine.

But when I set my rootPage an other component, like the login component, and go to the rating page, doesn't update the rate values.

when The rootPage is other Page:
doesnt-working

when the rootPage is the rating page:
working

ps: the NgModel is updating in the console!

Hello Felipe. Could you please check if there is any error in the console when the problem happens?

@andrucz nop, thats works fine, hasn't any error, until the rate is updating in the console. the problem is the view that dont update

I remember doing something like that and it worked. Could you isolate this problem and share the code with me?

Can I put some parts of code here? @andrucz

Sure. Let me know how the variables are created, how you make the transitions between pages, etc

evaluate.html

<form (ngSubmit)="rateService()" #loginForm="ngForm">

    <div class="evaluate-item">
      <h4>Atendimento</h4>
      <rating [(ngModel)]="rateDate.attendance"
        readOnly="false"
        max="5"
        emptyStarIconName="checkmark-circle-outline"    
        starIconName="checkmark-circle"
        nullable="false"
        name="attendance">
      </rating>
    </div>

    <div class="evaluate-item">
      <h4>Preço</h4>
      <rating [(ngModel)]="rateDate.price"
        readOnly="false"
        max="5"
        emptyStarIconName="checkmark-circle-outline"    
        starIconName="checkmark-circle"
        nullable="false"
        name="price">
      </rating>
    </div>

    <div class="evaluate-item">
      <h4>Qualidade do Serviço</h4>
      <rating [(ngModel)]="rateDate.quality"
        readOnly="false"
        max="5"
        emptyStarIconName="checkmark-circle-outline"    
        starIconName="checkmark-circle"
        nullable="false"
        name="quality">
      </rating>
    </div>
   
    [.....]

    <div class="evaluate-button">
      <button class="pa-button button-blue-dark" type="submit">
        Avaliar
      </button>
    </div>

  </form>

evaluate component

export class ServiceEvaluateNowComponent { 
  rateDate:any = {};

  constructor(private nav: NavController) { }

  public rateService() {
    console.log('rateDate', this.rateDate);
  }

}

evaluate module

import { NgModule } from '@angular/core';
import { SharedModule } from './../../../app/shared/shared.module';
import { ServiceEvaluateNowComponent } from './service-evaluate-now.component';
import { Ionic2RatingModule } from 'ionic2-rating';

@NgModule({
  imports: [
    SharedModule,
    Ionic2RatingModule
  ],
  declarations: [
    ServiceEvaluateNowComponent    
  ],
  entryComponents: [
    ServiceEvaluateNowComponent
  ],
  exports: [
    ServiceEvaluateNowComponent
  ]
})

export class ServiceEvaluateNowModule { }

app component

@Component({
  templateUrl: 'app.html'
})
export class MyApp {

  rootPage:any = LoginComponent;
  @ViewChild(Nav) nav: Nav;
}
......

in the preview page I only do a nav.push to the evaluate page

I declare the rating component in the evaluate module ServiceEvaluateNowModule and declare in the app.module

Ok. I will take a look as soon as possible. I am at office right now.

ok, thanks very much @andrucz

@felipel90 I've just created an application following the problem description: https://github.com/andrucz/ionic2-rating-issue29

It seems like it's working, no matter what I set as the root page.

Could you please clone that repo, test and see if I am missing some detail?

yep, I'll test, and return you, tks

this is the same way that I done. But doesn't work again! :(

Can you pass your email? I can share my code with you there.

Do you mean that the example worked or not? Sorry, I didn't get It.
Sure. andrucz@gmail.com

@andrucz the example Works fine. I'll contact you.

I fixed it, the problem was the map in the previous view.