Can't get ngSwitch to work

Hello! I’m tryong to enable a 2D and a 3D view on a mapPage. With that I am going to use ion-segment
to swtich between the two. I followed the directives in the Ionic page. But when I start the app it either says that there are no providers for ngSwitch or it says that I have to add an ngModule annotation.

I tried impoting it both in the map.ts and app.module.ts and set it in the imports.
But it doesn’t work, what am I missing?

< map.html >

<!-- 2D // 3D SWITCH START -->
  <div padding>
    <ion-segment [(ngModel)]='mapView'>
      <ion-segment-button value='2D'>

      <ion-segment-button value='3D'>
  <!-- 2D // 3D SWITCH END -->
<div [ngSwitch="mapView"]>
      <div class='twoDMap' id='2Dmap' *ngSwitchCase="'2D'"></div>
      <div class='threeDMap' id='3Dmap' *ngSwitchCase="'3D'">testing switch</div>

Hello, maybe I am wrong, but I do not know that all is closed by brackets


<div [ngSwitch]="mapView">

Best regards, anna-liebt

ahh that seems to be the devil, will try it as soon as I can! Thank you… :stuck_out_tongue:

Yes, that worked. But for some reason, when I load the page, it sets my first view as default, as I want it to. But when I then switch to 3D and switch back to 2D, the map disappears. So I had to hack it with a display:none/block way and ionSelect.

But I could miss something there as well, maybe, ngSwitch removes and sets and therefore it loses the connection between variables?


without code its hard to see what maybe the proplem.

Have in mind, that, maybe I am wrong, ngswitch works like ngif, mean if “2D” then there is no element with id=‘3dmap’ in dom. If your variable mapView change, then it should change the cases. If ‘3D’ then there is no element with id=2Dmap’ in dom anymore.

Best regards, anna-liebt

Exactly, that’s what I suspected. Just hiding it with a method call on the switch works better in my case then :slight_smile: Thank you!