How to display comma seperated list into table in ember.js?

by wilmer.lemke , in category: Javascript , a month ago

How to display comma seperated list into table in ember.js?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

Member

by aubrey , a month ago

@wilmer.lemke 

To display a comma-separated list into a table in Ember.js, you can follow these steps:

  1. First, you need to create a component that will display the table. You can do this by running the following command in your Ember CLI: ember generate component comma-separated-table
  2. In the app/templates/components/comma-separated-table.hbs file, you can add the following code to create the table structure: {{#each items as |item|}} {{/each}}
  3. In the app/components/comma-separated-table.js file, you can define the items property which will hold the comma-separated list of items and split it into an array: import Component from '@glimmer/component'; export default class CommaSeparatedTableComponent extends Component { get items() { return this.args.items.split(','); } }
  4. Now, you can use the comma-separated-table component in any of your templates and pass in the comma-separated list as a property:
  5. When you render the template with the comma-separated-table component, the comma-separated list will be displayed in a table format with each item in a separate row.


By following these steps, you can easily display a comma-separated list into a table in Ember.js using a custom component.