Is not working

[Saulolxx]

I opened a Issue earlier to ask them to add a way to listen to the events of Sticky #45 , well, reading the directive I discovered that this already exists, the problem is now another, I went to test the module and it just did not work, I used the listen to see if something is returned, and finally, it shows that the directive is active, but scrolling does not happen, CSS is not added, not even the component accompanies the scroll bar as it was proposed.

This is the Angular version I am using:

Angular CLI: 1.6.6
Node: 9.4.0
OS: win32 x64
Angular: 5.2.3
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.6
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.6
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0

This is my module, where I am importing the policy module:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { HeaderModule } from './header/header.module';
import { StickyModule } from 'ng2-sticky-kit';

import { AppComponent } from './app.component';
import { LoginComponent } from './login/login.component';

@NgModule({
  declarations: [
    AppComponent,
    LoginComponent
  ],
  imports: [
    BrowserModule,
    NgbModule.forRoot(),
    HeaderModule,
    StickyModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { HeaderModule } from './header/header.module';
import { StickyModule } from 'ng2-sticky-kit';

import { AppComponent } from './app.component';
import { LoginComponent } from './login/login.component';

@NgModule({
  declarations: [
    AppComponent,
    LoginComponent
  ],
  imports: [
    BrowserModule,
    NgbModule.forRoot(),
    HeaderModule,
    StickyModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

E This is the html where I am calling the directive:

<!--The content below is only a placeholder and can be replaced.-->

<sticky sticky-start="0">
  <nav>
      <div class="container">menu</div>
  </nav>
</sticky>
<!--mb-header></mb-header>
<div class="container">
  <mb-login></mb-login>
</div-->
<div style="height: 1500px"></div>

<!--router-outlet></router-outlet-->

[markleppke]

I tried this out yesterday. I'm having the same issue. Any advice from anyone on how to workaround or fix?

[bdabrowski]

Hey it appeared to me broken too. But once you wrap sticky directive and content in parent div it works.

[petewins]

@bdabrowski can you provide an example on stackblitz?

[alfie-far]

Donald Trump › Sounds good, doesn't work. ;-)