Manuel free commented 3 years ago

It isn't working correctly. You can to make the following check:

this.searchForm.get('behaviours').patchValue(["19", "12"]);

And after you have to make:

console.log(this.searchForm.value); or console.log(this.searchForm.get('behaviours').value);

You will see that behaviours control value is EMPTY, the searchForm isn't saving the values of this control.

Arkadiusz Idzikowski staff commented 3 years ago

Can you check with valueChanges method? The subscription should return correct value after the change in component:

this.searchForm.get('behaviours').valueChanges.subscribe(value => console.log(value));

Manuel free commented 3 years ago

this.searchForm.get('behaviours').valueChanges.subscribe(value => console.log(value));

Returns empty array. If I change control with normal click works perfectly, but If I set values to the control manually, this resets control and returns empty.

Manuel free commented 3 years ago

any news about this issue?

Arkadiusz Idzikowski staff commented 3 years ago

Please update your first post with full HTML/TS code that you use, because we couldn't reproduce such a problem on our end when we used example from the documentation.

Manuel free commented 3 years ago

The example is quiet simple. First time set control works perfectly, when I set values to control second time, the control is reset and return empty value []:

import { Component, OnInit, ViewChild, ViewContainerRef, OnDestroy, ChangeDetectionStrategy } from '@angular/core';

import { FormBuilder, FormGroup } from '@angular/forms';

@Component({ moduleId: module.id, selector: 'search', template: `

        <div class="row">
            <div class="col-12">
                <mdb-select [notFoundMsg]="'not_found_msg' | translate" [highlightFirst]="false" [allowClear]="true"
                    [multiple]="true" [enableSelectAll]="false" [filterEnabled]="true" [options]="optionsSelectBehaviours"
                    formControlName="behaviours">
                </mdb-select>
            </div>

            <div class="col-12">
                <button type="button" (click)="setValueSelect()">Set Value</button>
                <button type="button" (click)="getValueSelect()">Get Value</button>
            </div>
        </div>

    </form>`,
changeDetection: ChangeDetectionStrategy.Default,
//styleUrls: ['../../views/search/search.component.css']

})

export class SearchComponent implements OnInit, OnDestroy {

@ViewChild('f', { static: false }) private form;

public searchForm: FormGroup = null;
public optionsSelectBehaviours: Array<any> = [];

constructor(
    private readonly fb: FormBuilder,
    public viewContainerRef: ViewContainerRef,  
) {
    this.createForms();
}

ngOnInit() {

    this.optionsSelectBehaviours = [
        { value: '1', label: 'Option 1' },
        { value: '2', label: 'Option 2' },
        { value: '3', label: 'Option 3' },
    ];

}

createForms(): void 
{
    this.searchForm = this.fb.group({
        //default value, first time it works perfectly
        behaviours: ['1'],
    });

    /*this.searchForm.get('behaviours').valueChanges.subscribe((data: any) => {
        console.log("cambia", data)
    });*/

}

setValueSelect(): void 
{
    //second time, with this the control has been reset, new value is empty []
    this.searchForm.get('behaviours').patchValue(["2"]);
}

getValueSelect(): void 
{
    console.log(this.searchForm.get('behaviours').value)
}

ngOnDestroy() {

}

}

Arkadiusz Idzikowski staff commented 3 years ago

Thank you for the details, we managed to reproduce the problem on your example code. In this case, we need to add some additional fixes.