Not working with custom getter

[ZhukV]

Hi. I have a problem with custom getter and use the optionTextField

I have a custom getter:

get fullName(): string {
    return this.firstName + ' ' + this.lastName;
}

But, if I try to use this property as optionTextField, then the I see the only empty string, without any error.

[optimistex]

Hi!
Are you use such code?

<ngx-select [optionTextField]="fullName">

Pay attention on the square brackets.

[optimistex]

If the trouble is not solved then show me your template and code, please.

[ZhukV]

No, is not working, because the angular try to bind the value to the property.

Maybe problem exist in TypeScript, because the method hasOwnProperty returns false for custom getter/setter.

https://github.com/optimistex/ngx-select-ex/blob/master/src/app/lib/ngx-select/ngx-select.component.ts#L453-L454

[optimistex]

Fixed

The hasOwnProperty was changed to 'propertyName' in object.
Borrowed there: https://stackoverflow.com/a/11040508/6300699

class SmartObject {
    constructor(public id: number, public firstName: string, public lastName: string) {
    }

    get fullName(): string {
        return '+' + this.firstName + ' ' + this.lastName + '+';
    }
}

@Component({
    selector: 'single-demo',
    template: `
        <ngx-select [items]="items" optionTextField="fullName"></ngx-select>`,
})
export class SingleDemoComponent {
    items = [
        new SmartObject(1, 'firstName 1', 'lastName 1'),
        new SmartObject(2, 'firstName 2', 'lastName 2'),
        {id: 3, firstName: 'firstName 3', lastName: 'lastName 3', fullName: '+++ 3'},
        {id: 4, firstName: 'firstName 4', lastName: 'lastName 4', noName: '+++ 3'},
        // ...................
    ];

    constructor() {
        const t = new SmartObject(1, 'firstName 1', 'lastName 1');
        console.log('t', t);
        console.log('t.fullName', t.fullName);

        console.log(`t.hasOwnProperty('firstName')`, t.hasOwnProperty('firstName'));
        console.log(`t.hasOwnProperty('fullName')`, t.hasOwnProperty('fullName'));
        console.log(`t.hasOwnProperty('noName')`, t.hasOwnProperty('noName'));

        console.log(`'firstName' in t`, 'firstName' in t);
        console.log(`'fullName' in t`, 'fullName' in t);
        console.log(`'noName' in t`, 'noName' in t);
    }
}

[optimistex]

Please upgrade to v3.3.10: https://github.com/optimistex/ngx-select-ex/releases/tag/3.3.10

[ZhukV]

Wow, very thank you for fast fixing!