Can't update ion-list after promise resolves from SqlStorage

@rlouie wrote:

So, I continue down the frustrating path of my first Ionic2/Angular2 app. It's an alarm app that is really just made to mimic the one that comes standard on an android phone.

I am using SqlStorage to store a list of alarms and then retrieve them. This causes me absolutely no problem on page load. However, I have a little plus button to add a new alarm. When I click this plus button, I can set a breakpoint and see that I am getting back a list of alarms with my newly created alarm in it. I then set this.alarms to that value. But, it is not drawn on the page.

I know Angular 2's http methods are now returning Observables, and maybe this has something to do with it but I'm pretty lost here. All I want is:
* User Presses a button
* Retrieve stuff from SqlStorage
* Draw it on the screen

It's step 3 that I cannot get.

Here's my code for the page:

import {Page} from 'ionic-angular';
import {OnInit} from 'angular2/core';
import {AlarmService} from './alarm.service';

@Page({
  templateUrl: 'build/pages/page1/page1.html',
  providers: [AlarmService]
})
export class Page1 implements OnInit {
  constructor(private alarmService: AlarmService){}

  ngOnInit() {
    this.alarmService.getAlarms().then(alarms => this.alarms = alarms);
  }

  createAlarm() {
    this.alarmService.createAlarm(new Date(), true, true, [0,1,1,1,1,1,0])
        .then(alarms => {
          this.alarms = alarms;
        });
  }
}

Posts: 8

Participants: 3

Read full topic