Navigation

    Monaca & Onsen UI
    • Register
    • Login
    • Search
    • Tags
    • Users
    • Blog
    • Playground
    1. Home
    2. krism75
    K
    • Flag Profile
    • Profile
    • Following
    • Followers
    • Blocks
    • Topics
    • Posts
    • Best
    • Groups
    Save
    Saving

    krism75

    @krism75

    Senior .NET consultant

    0
    Reputation
    4
    Posts
    483
    Profile views
    0
    Followers
    0
    Following
    Joined Last Online
    Website unipartners.org/

    krism75 Follow

    Posts made by krism75

    • RE: OnsNavigator angular6 problem

      I have to re-open te case as it still exists in the lastest version.
      Please advise!

      posted in Onsen UI
      K
      krism75
    • RE: OnsNavigator angular6 problem

      v4.2.3 seems to fix this issue

      posted in Onsen UI
      K
      krism75
    • RE: OnsNavigator angular6 problem

      I was using v4.2.1, but now upgraded to v4.2.2. But the error stays.
      The error is in ‘omgevingenpage-component’ but the ons-navigator directive is in the app.component.html page. Below is some code. I stripped out some code to make it more simple.

      omgevingenpage-component.ts;

      import { OnInit } from '@angular/core';
      import {
        Component,
        OnsenModule,
        OnsNavigator,
        CUSTOM_ELEMENTS_SCHEMA
      } from 'ngx-onsenui';
      
      import { MenuService } from '../menu.service';
      import { OmgevingpageComponent } from '../omgevingpage-component/omgevingpage.component';
      import { OmgevingserverinfoComponent } from '../omgevingserverinfo-component/omgevingserverinfo.component';
      
      @Component({
        selector: 'ons-page',
        templateUrl: './omgevingenpage.component.html',
        styleUrls: ['./omgevingenpage.component.css']
      })
      export class OmgevingenpageComponent implements OnInit {
        page = OmgevingenpageComponent;
        constructor(private menuService: MenuService, private _navigator:OnsNavigator) { }
        openMenu() {
          this.menuService.open();
        }
        push() {
          this._navigator.element.pushPage(OmgevingpageComponent, { data: { omgeving: "TEST1" } });
        }
        ngOnInit() {
        }
      
        serverInfoClicked(id) {
          alert(id);
        }
      }
      
      

      omgevingenpage-component.html:

      <div class="content">
        <!--<ons-navigator swipeable [page]="page"></ons-navigator>-->
        <p style="text-align: center; opacity: 0.6; padding-top: 20px;">
          Swipe right to open the menu!
        </p>
        <div style="text-align: center; margin: 10px">
          <ons-button (click)="push(navi)">push</ons-button>
        </div>
      </div>
      
      

      app.component.html

      <ons-splitter #splitter>
        <ons-splitter-side [page]="sidePage" side="left" width="220px" collapse swipeable>
        </ons-splitter-side>
        <ons-splitter-content [page]="contentPage">
          <ons-navigator [page]="contentPage" swipeable>
          </ons-navigator>
        </ons-splitter-content>
      </ons-splitter>
      

      app.component.ts

      import {  OnInit } from '@angular/core';
      import { SwUpdate } from '@angular/service-worker';
      import { config } from 'rxjs';
      import {
        Component,
        Injectable,
        ViewChild,
        OnsenModule,
        NgModule,
        CUSTOM_ELEMENTS_SCHEMA
      } from 'ngx-onsenui';
      import { OmgevingenpageComponent } from './omgevingenpage-component/omgevingenpage.component';
      
      @Component({
        selector: 'app-root',
        templateUrl: './app.component.html',
        styleUrls: ['./app.component.css']
      })
      export class AppComponent implements OnInit {
        contentPage = OmgevingenpageComponent;
        @ViewChild('splitter') splitter;
        title = 'Lv Dashboard';
        constructor(private swUpdate: SwUpdate) {  }
      
        ngOnInit() {
          if (this.swUpdate.isEnabled) {
            this.swUpdate.available.subscribe(() => {
              if (confirm("Nieuwe versie beschikbaar, wil je deze laden?")) {
                window.location.reload();
              }
            });
          }
      
          Notification.requestPermission(function (status) {
            console.log('Notification permission status:', status);
          });
        }
        openMenu() {
          alert('OK');
        }
      }
      
      
      posted in Onsen UI
      K
      krism75
    • OnsNavigator angular6 problem

      I want to use OnsNavigator with angular 6. But wathever I try, I can’t get it to work.

      If I use OnsNavigator in the constructor of my pagecomponent I get:

      zone.js:665 Unhandled Promise rejection: StaticInjectorError(AppModule)[OmgevingenpageComponent -> OnsNavigator]: 
        StaticInjectorError(Platform: core)[OmgevingenpageComponent -> OnsNavigator]: 
          NullInjectorError: No provider for OnsNavigator! ; Zone: <root> ; Task: Window.addEventListener:message ; Value: Error: StaticInjectorError(AppModule)[OmgevingenpageComponent -> OnsNavigator]: 
        StaticInjectorError(Platform: core)[OmgevingenpageComponent -> OnsNavigator]: 
          NullInjectorError: No provider for OnsNavigator!
          at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js:979)
          at resolveToken (core.js:1232)
          at tryResolveToken (core.js:1182)
          at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1077)
          at resolveToken (core.js:1232)
          at tryResolveToken (core.js:1182)
          at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:1077)
          at resolveNgModuleDep (core.js:9217)
          at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:9911)
          at resolveDep (core.js:10276) Error: StaticInjectorError(AppModule)[OmgevingenpageComponent -> OnsNavigator]: 
        StaticInjectorError(Platform: core)[OmgevingenpageComponent -> OnsNavigator]: 
          NullInjectorError: No provider for OnsNavigator!
          at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://localhost:8080/vendor.js:33005:19)
          at resolveToken (http://localhost:8080/vendor.js:33258:24)
          at tryResolveToken (http://localhost:8080/vendor.js:33208:16)
          at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:8080/vendor.js:33103:20)
          at resolveToken (http://localhost:8080/vendor.js:33258:24)
          at tryResolveToken (http://localhost:8080/vendor.js:33208:16)
          at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (http://localhost:8080/vendor.js:33103:20)
          at resolveNgModuleDep (http://localhost:8080/vendor.js:41243:29)
          at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (http://localhost:8080/vendor.js:41937:16)
          at resolveDep (http://localhost:8080/vendor.js:42302:45)
      
      posted in Onsen UI
      K
      krism75