These are chat archives for angular/angular-2-ionic-2

3rd
Jul 2017
Praveen Saraogi
@raviloop
Jul 03 2017 11:51
how much time will it take for a person to switch from angular 1.x ionic to angular 2 ionic2
Oliver Henrique
@oliverhm
Jul 03 2017 12:55
Good morning guys
Someone have trouble with classes .fixed-content and .scroll-content?
UncertaintyP
@UncertaintyP
Jul 03 2017 14:50
@oliverhm No, they are working for me as expected. Whats the problem
@raviloop That depends heavily on the scale off the app but you should expect a lot of working hours in general. And you may think about using ionic 3/angular 4
atwoodhouse
@atwoodhouse
Jul 03 2017 16:15

I'm trying to implement ion-slides, and the event ionSlideDidChange:

      <ion-slides (ionSlideDidChange)="slideChanged()" [options]="{pager:true, paginationType: 'bullets', effect: 'slide'}">
          <ion-slide *ngFor="let l of lag">
              <img src="assets/img/lag/{{ l }}.png" />
          </ion-slide>
      </ion-slides>

I have the following function in the controller:

import { NavController, AlertController, Slides } from 'ionic-angular';
...
    @ViewChild(Slides) slides: Slides;
...
    public slideChanged() {
        let currentIndex = this.slides.getActiveIndex();
        console.log('Current index is', currentIndex);
    }

Nothing happens when I slide. If I change (ionSlideDidChange) to (ionDrag), it works, but of course the function is triggered to early (and a hundred times per slide).

Is ionSlideDidChange broken in Ionic 2, or am I doing it wrong?

UncertaintyP
@UncertaintyP
Jul 03 2017 16:18
@atwoodhouse This was working for me with Did and Will change as you describe it
atwoodhouse
@atwoodhouse
Jul 03 2017 16:19
Okay, and I'm not implementing it wrong? Does that mean that something else in the app is cancelling it?
UncertaintyP
@UncertaintyP
Jul 03 2017 16:21
Hmm I can't think of an event cancelling it. Try ionSlideWillChange
atwoodhouse
@atwoodhouse
Jul 03 2017 16:22
The function isn't triggered by ionSlideWillChange either :/
Btw, hilarious name...ionSlideWillChange. Emitted a second before the user decides to slide. :'D
UncertaintyP
@UncertaintyP
Jul 03 2017 16:23
Thats really strange :worried:
but the drag is registered ... crazy
atwoodhouse
@atwoodhouse
Jul 03 2017 16:24
It's an ionic 2 project...should probably migrate to ionic 3 before emitting an issue
Oliver Henrique
@oliverhm
Jul 03 2017 16:24
@UncertaintyP ionic apply margin-top to these classes, and for pages that doesn't have right icon on navbar, the margin applied is less then navbar.
atwoodhouse
@atwoodhouse
Jul 03 2017 16:24
Yeah, ionDrag works great
UncertaintyP
@UncertaintyP
Jul 03 2017 16:24
Don't think they changed slides from version 2 to 3
Oliver Henrique
@oliverhm
Jul 03 2017 16:25
And content is positioned on navbar back
UncertaintyP
@UncertaintyP
Jul 03 2017 16:28
@oliverhm Sorry I can't reproduce that behaviour. A not so nice fix is to resize() the content element
@atwoodhouse Because I also ran into quite some trouble with ion-slides I now have the swiper class imported directly, working like a charm ^_^
atwoodhouse
@atwoodhouse
Jul 03 2017 16:29
Aha, accessing low level functions?
UncertaintyP
@UncertaintyP
Jul 03 2017 16:32
kind of, I just erase the ionic wrapper and have direct access to the swiper API
But it increases size because you import the swiper on the pages needed
atwoodhouse
@atwoodhouse
Jul 03 2017 16:42

Okay...for now, I solved it with haxx...using ionDrag and my slideChange() looks like this:

    public slideChanged() {
        clearTimeout(this.slideTimeoutHandle);
        this.slideTimeoutHandle = setTimeout(() => {
            let currentIndex = this.slides.getActiveIndex();
            console.log('Current index is', currentIndex);
            ...
        }, 200);
    }

It's ugly, but it works.

Arend
@avanerk
Jul 03 2017 19:33
hello
How can I clear a selectbox in angular?
When I refill the options array with a value matching the previous values
it auto selects that value
atwoodhouse
@atwoodhouse
Jul 03 2017 22:41
@avanerk: in Angular 1 it was possible to set the model value to null, in order to achieve "nothing selected". However, Angular 2 had some troubles with that before 2.2.1. (ionic-team/ionic#9682)
As long as your Angular is >= 2.2.1 it should work by setting the model to null, just as in Angular 1.