Modal closes on first change on model when in component within table

[dcharles525]

• I'm submitting a ...

  • bug report
  • feature request
  • support request~ Ask in the official Ember Discord server.

• What is the current behavior?
  Currently, I have an edit button that opens an ember-bootstrap modal. This modal allows the user to edit the record in the row. However, when any value in the record (model) is changed, the modal gets hidden. I have even tried setting it manually to never close. I believe this is the table refreshing and the component is getting reset? After the first change, I can reopen the modal and it stays open as intended.

• Please tell us about your environment:

• ember-models-table version: 3.4.0
• ember version:
• ember-data version: 3.25.0
• ember-cli version: 3.25.2
• node version: 14.15.0
• npm version: 6.14.8
• ember-bootstrap version: 4.9.0

[onechiporenko]

Hello, @dcharles525. Could you please provide a demo with reproduction? It's pretty hard to get what was wrong without it. Thanks

[dcharles525]

@onechiporenko I was actually able to figure this out. Since the models were being passed to the component via a getter that was filtering out certain models, it needed a @computed decorator to stop it from closing the modal on initial change.

[cah-brian-gantzler]

@computed has been deprecated. If you are on Ember 4.1+ You should use the @cache emberjs/ember.js#19826. If you are on a version prior to Ember 4.1 you should use @cache from https://github.com/ember-polyfills/ember-cached-decorator-polyfill