Adding formControl as a component argument

[psilospore]

I was trying to figure out how to use a formControl with this library and couldn't figure out how to then I saw this issue #556

So I allowed a user to pass in a FormControl in.
e.g. for SingleDemoComponent it would be

  <ng-select [allowClear]="true"
              [formControl]="singleControl"
              [items]="items"
              ...
  </ng-select>

export class SingleDemoComponent {
  public items:Array<string> = ...

  private value:any = {};
  private _disabledV:string = '0';
  private disabled:boolean = false;
  private singleControl:FormControl = new FormControl();
...

Now singleControl should be accessible. You can get the value, if it's pristine, dirty, etc.

This is my first open source PR so sorry if something's wrong.

[codecov-io]

Codecov Report

Merging #758 into development will decrease coverage by 5.39%.
The diff coverage is 60%.

@@              Coverage Diff               @@
##           development     #758     +/-   ##
==============================================
- Coverage        37.33%   31.93%   -5.4%     
==============================================
  Files               11       11             
  Lines              450      454      +4     
  Branches            73       71      -2     
==============================================
- Hits               168      145     -23     
- Misses             282      309     +27

Impacted Files	Coverage Δ
src/select/select.module.ts	100% <100%> (ø)	⬆️
src/select/select.ts	20.29% <50%> (-7.42%)	⬇️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 3afaf63...2fe710e. Read the comment docs.

[psilospore]

Here's the form control objects for the various examples

Single when Berlin is selected:

{
    "asyncValidator":null,
    "_pristine":false,
    "_touched":true,
    "_onDisabledChange":[
        null,
        null
    ],
    "_onChange":[
        null,
        null,
        null
    ],
    "_value":[
        {
            "text":"Berlin",
            "id":"Berlin"
        }
    ],
    "_status":"VALID",
    "_errors":null,
    "_valueChanges":{
        "_isScalar":false,
        "observers":[

        ],
        "closed":false,
        "isStopped":false,
        "hasError":false,
        "thrownError":null,
        "__isAsync":false
    },
    "_statusChanges":{
        "_isScalar":false,
        "observers":[

        ],
        "closed":false,
        "isStopped":false,
        "hasError":false,
        "thrownError":null,
        "__isAsync":false
    }
}

Multiple when Amsterdam and Antwerp are selected and we use Validators.required:

{
  "asyncValidator": null,
  "_pristine": false,
  "_touched": true,
  "_onDisabledChange": [
    null
  ],
  "_onChange": [
    null,
    null
  ],
  "_value": [
    {
      "text": "Amsterdam",
      "id": "Amsterdam"
    },
    {
      "text": "Antwerp",
      "id": "Antwerp"
    }
  ],
  "_status": "VALID",
  "_errors": null,
  "_valueChanges": {
    "_isScalar": false,
    "observers": [],
    "closed": false,
    "isStopped": false,
    "hasError": false,
    "thrownError": null,
    "__isAsync": false
  },
  "_statusChanges": {
    "_isScalar": false,
    "observers": [],
    "closed": false,
    "isStopped": false,
    "hasError": false,
    "thrownError": null,
    "__isAsync": false
  }
}

Couldn't test Children because it seems like even the unmodified version isn't working. Even on your site. I don't see options when I type or click the dropdown.

[maximelafarie]

@valorkin Let's merge this ! 😄

[JordyVlassembrouck]

Can somebody pleeeaase merge this issue? We are actually waiting for it! 😄

[psilospore]

@JordyVlassembrouck so @amitdahan mentioned you can use formControl like normal. See the conversation above. I'm going to test if that works for me but I'm currently swamped at work. Also this repo is dead apparently however our company might maintain a fork in the future.

[optimistex]

@psilospore I continued to developing the package in the fork: https://github.com/optimistex/ngx-select-ex
You are may help me to contribute this if you want.

Yes, I saw your fork: https://github.com/psilospore/ng-next-select
It contains little fixes. But I completely rewrote the package. Try it!