Skip to content

Instantly share code, notes, and snippets.

@jsturgis

jsturgis/components.my-component\.js

Last active June 2, 2022 21:53
Show Gist options
  • Save jsturgis/071419f189de940b69343bf4174146f3 to your computer and use it in GitHub Desktop.
Save jsturgis/071419f189de940b69343bf4174146f3 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. jsturgis revised this gist Jun 2, 2022. No changes.
  2. jsturgis revised this gist Jun 2, 2022. No changes.
  3. jsturgis created this gist Jun 2, 2022.
    15 changes: 15 additions & 0 deletions components.my-component\.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,15 @@
    import Component from '@glimmer/component';
    import { tracked } from '@glimmer/tracking';
    import { get, action } from '@ember/object';

    export default class extends Component {
    @tracked
    entities = get(this.args, 'cohort.entities')
    .toArray()
    .slice(0, 5);

    @action
    addEntity() {
    this.entities.addObject(this.entities.length + 1);
    }
    }
    6 changes: 6 additions & 0 deletions controllers.application\.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,6 @@
    import Controller from '@ember/controller';

    export default class ApplicationController extends Controller {
    appName = 'Ember Twiddle';
    cohorts = {entities: [1,2,3]};
    }
    7 changes: 7 additions & 0 deletions templates.application\.hbs
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    <h1>Welcome to {{this.appName}}</h1>
    <br>
    <br>
    {{outlet}}
    <MyComponent @cohort={{this.cohorts}}/>
    <br>
    <br>
    7 changes: 7 additions & 0 deletions templates.components.my-component\.hbs
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    {{yield}}
    entities
    {{#each this.entities as |e|}}
    <div>{{e}}</div>
    {{/each}}

    <button onclick={{this.addEntity}}>add</button>
    22 changes: 22 additions & 0 deletions twiddle\.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,22 @@
    {
    "version": "0.17.1",
    "EmberENV": {
    "FEATURES": {},
    "_TEMPLATE_ONLY_GLIMMER_COMPONENTS": false,
    "_APPLICATION_TEMPLATE_WRAPPER": true,
    "_JQUERY_INTEGRATION": true
    },
    "options": {
    "use_pods": false,
    "enable-testing": false
    },
    "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js",
    "ember": "3.18.1",
    "ember-template-compiler": "3.18.1",
    "ember-testing": "3.18.1"
    },
    "addons": {
    "@glimmer/component": "1.0.0"
    }
    }