[BUG]: labelAttribute doesn't work if formValueAttribute is specified

[emmanueldouaud]

I'm submitting a

• Regression (a behavior that used to work and stopped working in a new release)
• Bug report
• Enhancement
• Feature request
• Documentation issue or request

Description

• Bug: Description of the issue you encountered_
• Feature: Description of the feature. Cause and its Motivation_

Version Information

@ionic/angular 5.5.2
@angular 11.2.6
ionic4-auto-complete: 2.9.8

Browser

• Chrome - Version 90.0.4430.212 (Build officiel) (x86_64)
• Mozilla Firefox - x.x.x
• Opera - x.x.x
• Microsoft Edge - x.x.x

My problem is the same as bug #64 , I will be more details oriented.

I have an array of objects:

[{company_parent_3_name: "BAUD", count: "587", name: "BAUD (587)"},
{company_parent_3_name: "ED ERTECO", count: "1", name: "ED ERTECO (1)"},
{company_parent_3_name: "INDEPENDANTS", count: "7", name: "INDEPENDANTS (7)"}]

Here is the HTML code:

 <ion-auto-complete [dataProvider]="this" [(ngModel)]="object['company_parent_3_name']"
        [options]="{searchIcon:'undefined'}" [clearInvalidInput]="false">
      </ion-auto-complete>

Here is the dataProvider getResults function:

  getResults(keyword) {
    const promise = new Promise((resolve, reject) => {
      console.log(`getResults(): ${keyword}`);
      console.log(this.pointOfSalePossibleValues[`parents3`]);
      const result = this.pointOfSalePossibleValues[`parents3`].filter(object => object[`company_parent_3_name`].toLowerCase().includes(keyword.toLowerCase(), -1));
      console.log(result);
      resolve(result);
    });
    return promise;
  }

I want the name to be displayed on the suggestions. So I set a variable:
public labelAttribute = 'name';
on my dataProvider object.
Everything work fine!
Of course if I comment the labelAttribute variable I have an error because auto-complete don't know which field to choose to display. So the variable labelAttribute is really used as expected.

But I want to have the field 'company_parent_3_name' saved on the database instead of the 'name' field. 'company_parent_3_name' is the objects primary key. So i set a variable:
public formValueAttribute = 'company_parent_3_name';
on my dataProvider object.
The non expected result:
The 'company_parent_3_name' is taken into account as the value of the auto-complete as I wanted but is also used as text displayed in the suggestions list. I don't see 'name' values any more. The variable labelAttribute seems to not be used any more. And to confirme that, I can comment it without generating any error.

Idea of reason:
I haven't spend so much time trying to understand your code but if it can help, here is what I have seen. In both getFormValue and getLabel functions you have the following code:

let attr = this.provider.formValueAttribute == null ?
  this.provider.labelAttribute : this.provider.formValueAttribute;

If I understand well, as soon as the variable formValueAttribute is defined the variable labelAttribute is override. Ok for the getFormValue function but it's probably not the appropriate code for the getLabel function...

Thanks in advance for any help.