Property 'scrollSpyService' does not exist on type 'AppComponent'

[Sumeet Darade]

I am getting this error at this.scrollSpyService = scrollSpyService; and this.scrollSpyService.getObservable('window').subscribe((e: any) => {

in following code

constructor(scrollSpyService: ScrollSpyService) {
        this.scrollSpyService = scrollSpyService;
    }


  ngAfterViewInit() {
    this.scrollSpyService.getObservable('window').subscribe((e: any) => {
        console.log('ScrollSpy::window: ', e);
    });

Angular -rc version.

is importing View necessary?

because @view decorator was dropped in beta. but still i tried and it gave error

Module '"try2/node_modules/@angular/core/index"' has no export
ed member 'View'.

[João Ribeiro]

I just updated readme to remove View from demo.

Are you injecting ScrollSpyService when bootstrapping your app?

import {bootstrap} from '@angular/platform-browser-dynamic';
import {ScrollSpyService} from 'ng2-scrollspy';

bootstrap(AppComponent, [
    ScrollSpyService
]);

[Sumeet Darade]

Yes I am ! I will try again and revert

Thanks

[Sumeet Darade]

@JonnyBGod

Still the same

my gulp run says :-
Property 'scrollSpyService' does not exist on type 'AppComponent'

browser console says :-
Error loading http://localhost:3000/immutable as "immutable" from http://localhost:3000/js/vendor/ng2-scrollspy/src/core/service.js

I tried mapping to 'js/vendor/ng2-scrollspy/src' and 'js/vendor/ng2-scrollspy' both. both give same errors.

addin index.js as main in packages otherwise it cant get package ng2scrollspy. like this

var packages = {
        'app':                        { main: 'boot.js',  defaultExtension: 'js' },
        'rxjs':                       { defaultExtension: 'js' },
        'angular2-grid':              { main: 'main.js',  defaultExtension: 'js' },
        'ng2-scrollspy:              { main: 'index.js', defaultExtension: 'js'},
    };

EDIT :

if i dont specify main: 'index.js'

Error loading http://localhost:3000/js/vendor/ng2-scrollspy as "ng2-scrollspy" from http://localhost:3000/js/app/boot.js

[João Ribeiro]

How did you install the package?

npm install ng2-scrollspy

[Sumeet Darade]

yes i did the same ! :(

[João Ribeiro]

browser console says :-
Error loading http://localhost:3000/immutable as "immutable" from http://localhost:3000/js/vendor/ng2-scrollspy/src/core/service.js

You should have "immutable": "^3.8.1" installed and this should work.

If you are using SystemJs try to config with a paths entry such as:

"ng2-scrollspy/*": "node_modules/ng2-scrollspy/*"

[Sumeet Darade]

immutable was already a dependency in ng2-scrollspy. and module was present.
I did install immutable separately again as you said, nothing different.
I even changed system.config as above , after which it cant even find 'ng2-scrollspy'

[João Ribeiro]

Can you create a repo for me to check it out and see if I can help?

[Sumeet Darade]

Repo

working directory assets/app

npm run gulp in one commandline , npm start in other

gulp has task called vendor , which will copy required node modules to public/js/vendor
compiled app is in public/js/app
systemjs.config.js is in public/

Thanks !

[Dino Pereira]

Any update on this? I'm having the same issue, the same conditions exactly. In my case I'm using the webpack angular-cli.

[Sumeet Darade]

@dinospereira No. I gave up.

Ended up using Host listener in the root component. works good

public yPosition : number = 0;
     @HostListener('document:scroll', ['$event.target']) onscroll(target: any) {
         this.yPosition = window.pageYOffset;
     }

[João Ribeiro]

Please try new version v0.3.0.

Make sure you read docs for new declaration system.

I will try to create more documentation and example during next week.