open-index/open-npm huggingface dataset:
npm package: @searchkings/ngx-scroll-tracker
Description: This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.12.
Latest version: 1.0.7
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# NgxScrollTracker

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.12.

## Code scaffolding

Run `ng generate component component-name --project ngx-scroll-tracker` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project ngx-scroll-tracker`.
> Note: Don't forget to add `--project ngx-scroll-tracker` or else it will be added to the default project in your `angular.json` file. 

## Build

Run `ng build ngx-scroll-tracker` to build the project. The build artifacts will be stored in the `dist/` directory.

## Publishing

After building your library with `ng build ngx-scroll-tracker`, go to the dist folder `cd dist/ngx-scroll-tracker` and run `npm publish`.

## Running unit tests

Run `ng test ngx-scroll-tracker` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
npm package: @searchkings/ngx-url-form-sync
Description: ``` @Component({   selector: 'component-example',   templateUrl: './example.component.html',   styleUrls: ['./example.component.scss'] }) export class ExampleComponent implements OnDestroy, OnInit {   public dateForm: FormGroup;   private urlFormS
Latest version: 1.0.3
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# URL Form Syncer

## Usage

### In your component class:

```
@Component({
  selector: 'component-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.scss']
})
export class ExampleComponent implements OnDestroy, OnInit {
  public dateForm: FormGroup;
  private urlFormSync: UrlFormSyncer;
  private onDestroy$: Subject<void> = new Subject<void>();

  constructor(
    private activatedRoute: ActivatedRoute,
    private formBuilder: FormBuilder,
    private urlFormSyncService: UrlFormSyncService
  ) {}

  ngOnInit() {
    /**
    *  Some form values you would like to keep in sync with the URL params
    **/
    this.dateForm = this.formBuilder.group({
      grouping: ['accounts'],
      date_range: ['last_30_days']
    });

    /**
    *  Create a new instance of UrlFormSyncer
    **/
    this.urlFormSync = this.urlFormSyncService.create(
      this.dateForm,
      this.activatedRoute,
      this.onDestroy$
    );

    /**
    *  Use formValues$ observable to listen for changes and
    *  perform some arbitrary action
    **/
    this.urlFormSync.formValues$
      .pipe(takeUntil(this.onDestroy$))
      .subscribe(values => {
        // Perform some action (e.g. an http request) with the new values
      });
  }

  ngOnDestroy() {
    this.onDestroy$.next();
    this.onDestroy$.complete();
  }
}
```

# API

## UrlFormSyncService

### `create(formGroup: FormGroup, activatedRoute: ActivatedRoute, destroySubject?: Subject\<any>)`

Create a new `UrlFormSyncer`.

#### Returns

- instance of `UrlFormSyncer`

| Parameter                     | Description                                                                                                                                            |
| ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **formGroup (required)**      | A form group to keep in-sync with any URL changes                                                                                                      |
| **activatedRoute (required)** | The injected instance of ActivatedRoute to listen for param changes on                                                                                 |
| **destroySubject (optional)** | A subject the UrlSyncer will listen to for when to stop syncing changes. Typically this is a subject you would emit to in your component's ngOnDestroy |

#### create(formGroup: FormGroup, activatedRoute: ActivatedRoute, destroySubject?: Subject\<any>): UrlFormSyncer

#### `destroy()`

Stop listening for any form / URL changes.