tag input autocomplete Items drop-down appears in odd position after entering maximumItems.

[pycraft114]

PLEASE MAKE SURE THAT:

• you searched similar issues online (9/10 issues in this repo are solved by googling, so please...do it)
• you provide an online demo I can see without having to replicate your environment
• you help me by debugging your issue, and if you can't, do go on filling out this form

I'm submitting a ... (check one with "x")

[ v ] bug report => search github for a similar issue or PR before submitting
[  ] support request/question

Notice: feature requests will be ignored, submit a PR if you'd like

Current behavior

tag input drop-down that shows autoCompleteItems appears in odd position after entering all maximum items.

picture above shows that drop down appears at expected position when trying to enter the last item. (the maxItem property is set to 3)

And picture above shows that the drop down appears at odd position (upper left corner) when entering all available item is finished.

Expected behavior

when max number of items is entered, the drop down should not be displayed.

Minimal reproduction of the problem with instructions (if applicable)

What do you use to build your app?. Please specify the version

"dependencies": { "@angular/animations": "4.4.6", "@angular/cdk": "2.0.0-beta.12", "@angular/common": "4.4.6", "@angular/compiler": "4.4.6", "@angular/compiler-cli": "4.4.6", "@angular/core": "4.4.6", "@angular/forms": "4.4.6", "@angular/http": "4.4.6", "@angular/language-service": "4.4.6", "@angular/material": "2.0.0-beta.12", "@angular/platform-browser": "4.4.6", "@angular/platform-browser-dynamic": "4.4.6", "@angular/platform-server": "4.4.6", "@angular/router": "4.4.6", "@types/jasmine": "2.6.0", "@types/jasminewd2": "2.0.3", "ag-grid": "13.2.0", "ag-grid-angular": "13.2.0", "angularfire2": "4.0.0-rc.2", "apollo-angular": "0.13.1", "apollo-client": "1.9.2", "bootstrap": "4.0.0-beta", "codelyzer": "3.2.0", "core-js": "2.4.1", "firebase": "4.3.1", "graphql-tag": "2.4.2", "hammerjs": "2.0.8", "jasmine-core": "2.8.0", "jasmine-spec-reporter": "4.2.1", "jquery": "3.2.1", "karma": "1.7.1", "karma-coverage-istanbul-reporter": "1.3.0", "ngx-chips": "1.5.3", "popper.js": "1.12.5", "rxjs": "5.4.2", "tether": "1.4.0", "ts-node": "3.3.0", "zone.js": "0.8.14" }, "devDependencies": { "@angular/cli": "1.4.9", "@angular/compiler-cli": "4.4.6", "@angular/language-service": "4.4.6", "@types/jasmine": "2.5.53", "@types/jasminewd2": "2.0.2", "@types/node": "6.0.88", "apollo-codegen": "0.17.0", "codelyzer": "3.1.1", "jasmine-core": "2.6.2", "jasmine-spec-reporter": "4.1.0", "karma": "1.7.0", "karma-chrome-launcher": "2.1.1", "karma-cli": "1.0.1", "karma-coverage-istanbul-reporter": "1.2.1", "karma-jasmine": "1.1.0", "karma-jasmine-html-reporter": "0.2.2", "protractor": "5.1.2", "rollup": "0.50.0", "rollup-plugin-commonjs": "8.2.1", "rollup-plugin-node-resolve": "3.0.0", "rollup-plugin-uglify": "2.0.1", "ts-node": "3.2.0", "tslint": "5.3.2", "typescript": "2.5.3" }

Angular version:

4.4.6

ngx-chips version:

1.5.3

**Browser: Chrome

[Gbuomprisco]

Hi, are you using appendToBody=false? If so, it should maybe be set to true (default) so that the size of the form will not interfere with the positioning of the dropdown

[pycraft114]

@Gbuomprisco Yes appendToBody property is set to false due to necessary reason. In this case, how should i fix this issue?

[Gbuomprisco]

what's the output if you set it to true? I don't see any solution in this case

[pycraft114]

@Gbuomprisco the same bug happens even tho when it is set to true. What does the drop down depends on ? whether to show or not

[Gbuomprisco]

If you search in the threads you will find a workaround for that issue, you'll need to set that to true and edit some style

[pycraft114]

@Gbuomprisco are there any possible way to fix this while appendToBody property is still set to false?

[pycraft114]

@Gbuomprisco

If you search in the threads you will find a workaround for that issue, you'll need to set that to true and edit some style

"true" meaning by the value of appendToBody?

[Gbuomprisco]

Yep

[Ludval]

Hello i've got the same problem, i set "appendToBody" to true but the dropdown always appears in odd position @Gbuomprisco

[pycraft114]

@Gbuomprisco Made a pull request for this. https://github.com/Gbuomprisco/ngx-chips/pull/640 Hide autoComplete option dropdown when amount of items are reached to maxItems

[pycraft114]

@lud42 this issue is solved at version 1.6.2 closing this issue