Primeng: Make Router an optional dependency in SplitButton. Fix Docs for SplitButton

[vlodko]

I'm submitting a ... (check one with "x")

[x] bug report => Search github for a similar issue or PR before submitting

Minimal reproduction of the problem with instructions
Run plnkr demo and see console output.

Plunkr Case (Bug Reports)
http://plnkr.co/edit/sYohD6WbbG3MsXW2Y5E0?p=preview

Current behavior
Console error:
VM1659 AppComponent.ngfactory.js:15 ERROR Error: No provider for Router!

Expected behavior
Do not throw error.

What is the motivation / use case for changing the behavior?
First - there is nothing said about importing Angular Router on the Doc page here

Second: I don't want to import Router when I'm not using any routing features.
It should be optional.

Please tell us about your environment:

• Env: Win 10, Webstorm, Yarn

• Angular version: 2.4.9

• PrimeNG version: 2.0.6

• Browser: [all]

• Language: [TypeScript 2.1.5]

[cagataycivici]

We couldn't find a way to make it optional, feel free to provide a PR if you know a way to do it so please.

[vlodko]

@cagataycivici at least, add a line to the docs that you need @angular/router to make splitbutton work.

[bikashmstha]

@vlodko i can,t make splitbutton work even after using routing ? can you help me

[vlodko]

@bikashmstha what is the error? do you have a plnkr to reproduce it?

[bikashmstha]

@vlodko no i dont't have plnkr.
Error: No provider for Router!
at injectionError (core.es5.js:1169)
at noProviderError (core.es5.js:1207)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._throwOrNull (core.es5.js:2649)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKeyDefault (core.es5.js:2688)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKey (core.es5.js:2620)
at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_.get (core.es5.js:2489)
at resolveNgModuleDep (core.es5.js:9473)
at NgModuleRef_.webpackJsonp.../../../core/@angular/core.es5.js.NgModuleRef_.get (core.es5.js:10555)
at resolveDep (core.es5.js:11058)
at createClass (core.es5.js:10922)

[vlodko]

@bikashmstha I was using such _hack-around_ to omit real @angular/router

import { Router } from '@angular/router';
...

  // until we don't use actual NG2 Router features, we're mocking Router service
  providers: [{ provide: Router, useValue: {} }]

[mmlitvin]

@cagataycivici I agree on "at least, add a line to the docs that you need @angular/router to make splitbutton work."

It also was mentioned in this Issue
https://github.com/primefaces/primeng/issues/236
that document "I can't think of a way to do it right now without the router apis so updated the docs. Thank you."

I do not see any updates to documentation

[joelr2m]

I get this with primeNg 5.2.0 and using angular 5.1.2.

ERROR Error: StaticInjectorError(AppModule)[RouterLinkWithHref -> Router]: StaticInjectorError(Platform: core)[RouterLinkWithHref -> Router]: NullInjectorError: No provider for Router! at _NullInjector.get (webpack-internal:///../../../core/esm5/core.js:1208) at resolveToken (webpack-internal:///../../../core/esm5/core.js:1506) at tryResolveToken (webpack-internal:///../../../core/esm5/core.js:1448) at StaticInjector.get (webpack-internal:///../../../core/esm5/core.js:1316) at resolveToken (webpack-internal:///../../../core/esm5/core.js:1506) at tryResolveToken (webpack-internal:///../../../core/esm5/core.js:1448) at StaticInjector.get (webpack-internal:///../../../core/esm5/core.js:1316) at resolveNgModuleDep (webpack-internal:///../../../core/esm5/core.js:11061) at NgModuleRef_.get (webpack-internal:///../../../core/esm5/core.js:12294) at resolveDep (webpack-internal:///../../../core/esm5/core.js:12784)

Tried everything to go around it, without prevail. Importing it there only moves the error to the AppModule. Which gives this error:

Error: StaticInjectorError(AppModule)[RouterLinkWithHref -> Router]: StaticInjectorError(Platform: core)[RouterLinkWithHref -> Router]: NullInjectorError: No provider for Router! at _NullInjector.get (core.js:994) at resolveToken (core.js:1292) at tryResolveToken (core.js:1234) at StaticInjector.get (core.js:1102) at resolveToken (core.js:1292) at tryResolveToken (core.js:1234) at StaticInjector.get (core.js:1102) at resolveNgModuleDep (core.js:10847) at NgModuleRef_.get (core.js:12080) at resolveDep (core.js:12570)

I am using a MenuItem[] in my component. Doesnt matter which properties they use, same result.

[m-liddell]

I'm copying the exact code from the demo and have the same issue as @joelr2m, please fix!

[birenajmera]

Anyone found a resolution?

[vlodko]

@birenajmera that's what worked for me
https://github.com/primefaces/primeng/issues/2558#issuecomment-319198514

[Anurag016]

import {RouterTestingModule} from '@angular/router/testing';

[vlodko]

@Anurag016 is it working in the same manner as

  providers: [{ provide: Router, useValue: {} }]

?

[mariosgit]

Just had the same issue while experimenting with primeng 6.0.0. Was able to solve it with #2558. It's confusing for a newbie.