Primary outlet is already registered with navbar

Ionic Framework ionic-v3
1

I am using ion-navbar and after updati ng to the latest CLI version and using gulp im gettin thos exception:

2     074322   group    EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error during instantiation of NavRouter!.
ORIGINAL EXCEPTION: Primary outlet is already registered.
ORIGINAL STACKTRACE:
Error: Primary outlet is already registered.
    at new BaseException (http://localhost:8100/build/js/app.bundle.js:28664:23)
    at RootRouter.Router.registerPrimaryOutlet (http://localhost:8100/build/js/app.bundle.js:34553:19)
    at NavRouter.RouterOutlet (http://localhost:8100/build/js/app.bundle.js:32518:32)
    at new NavRouter (http://localhost:8100/build/js/app.bundle.js:44357:16)
    at http://localhost:8100/build/js/app.bundle.js:26824:63
    at Injector._instantiate (http://localhost:8100/build/js/app.bundle.js:20649:27)
    at Injector._instantiateProvider (http://localhost:8100/build/js/app.bundle.js:20575:25)
    at Injector._new (http://localhost:8100/build/js/app.bundle.js:20564:21)
    at InjectorInlineStrategy.instantiateProvider (http://localhost:8100/build/js/app.bundle.js:20064:30)
    at ElementDirectiveInlineStrategy.init (http://localhost:8100/build/js/app.bundle.js:22715:24)
ERROR CONTEXT:
[object Object]
3     074322   error    EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error during instantiation of NavRouter!.
ORIGINAL EXCEPTION: Primary outlet is already registered.
ORIGINAL STACKTRACE:
Error: Primary outlet is already registered.
    at new BaseException (http://localhost:8100/build/js/app.bundle.js:28664:23)
    at RootRouter.Router.registerPrimaryOutlet (http://localhost:8100/build/js/app.bundle.js:34553:19)
    at NavRouter.RouterOutlet (http://localhost:8100/build/js/app.bundle.js:32518:32)
    at new NavRouter (http://localhost:8100/build/js/app.bundle.js:44357:16)
    at http://localhost:8100/build/js/app.bundle.js:26824:63
    at Injector._instantiate (http://localhost:8100/build/js/app.bundle.js:20649:27)
    at Injector._instantiateProvider (http://localhost:8100/build/js/app.bundle.js:20575:25)
    at Injector._new (http://localhost:8100/build/js/app.bundle.js:20564:21)
    at InjectorInlineStrategy.instantiateProvider (http://localhost:8100/build/js/app.bundle.js:20064:30)
    at ElementDirectiveInlineStrategy.init (http://localhost:8100/build/js/app.bundle.js:22715:24)
ERROR CONTEXT:
[object Object]
4     074323   error    STACKTRACE:
5     074323   error    Error: Uncaught (in promise): EXCEPTION: Error during instantiation of NavRouter!.
ORIGINAL EXCEPTION: Primary outlet is already registered.
ORIGINAL STACKTRACE:
Error: Primary outlet is already registered.
    at new BaseException (http://localhost:8100/build/js/app.bundle.js:28664:23)
    at RootRouter.Router.registerPrimaryOutlet (http://localhost:8100/build/js/app.bundle.js:34553:19)
    at NavRouter.RouterOutlet (http://localhost:8100/build/js/app.bundle.js:32518:32)
    at new NavRouter (http://localhost:8100/build/js/app.bundle.js:44357:16)
    at http://localhost:8100/build/js/app.bundle.js:26824:63
    at Injector._instantiate (http://localhost:8100/build/js/app.bundle.js:20649:27)
    at Injector._instantiateProvider (http://localhost:8100/build/js/app.bundle.js:20575:25)
    at Injector._new (http://localhost:8100/build/js/app.bundle.js:20564:21)
    at InjectorInlineStrategy.instantiateProvider (http://localhost:8100/build/js/app.bundle.js:20064:30)
    at ElementDirectiveInlineStrategy.init (http://localhost:8100/build/js/app.bundle.js:22715:24)
ERROR CONTEXT:
[object Object]
    at resolvePromise (http://localhost:8100/build/js/angular2-polyfills.js:543:32)
    at http://localhost:8100/build/js/angular2-polyfills.js:579:18
    at ZoneDelegate.invokeTask (http://localhost:8100/build/js/angular2-polyfills.js:365:38)
    at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (http://localhost:8100/build/js/app.bundle.js:27901:41)
    at ZoneDelegate.invokeTask (http://localhost:8100/build/js/angular2-polyfills.js:364:43)
    at Zone.runTask (http://localhost:8100/build/js/angular2-polyfills.js:263:48)
    at drainMicroTaskQueue (http://localhost:8100/build/js/angular2-polyfills.js:482:36)
    at XMLHttpRequest.ZoneTask.invoke (http://localhost:8100/build/js/angular2-polyfills.js:434:22)

Here is my code:

<ion-menu [content]="content" >
  <!-- side="right" -->
    <ion-toolbar>
      <ion-title>Pages</ion-title>
    </ion-toolbar>
    <ion-content>
      <ion-list>
        <button menuToggle ion-item (click)="openPage(item.Id)"  *ngFor="#item of sideMenuItems" >
        {{item.Title}}
        </button>
      </ion-list>
    </ion-content>
  </ion-menu>
  <ion-nav id="navMenu" #content [root]="rootPage"></ion-nav>`

Any help ?

2

Did you update angular 2 independently from ionic2? Recent NG2 beta’s had several errors in them, which is why we haven’t update the newer releases yet.

3

I created a new project and moved the source code to it, this solved my issue.