Skip to content

Instantly share code, notes, and snippets.

@Gaurav0
Last active May 27, 2020 17:40
Show Gist options
  • Select an option

  • Save Gaurav0/c4a85ffd19620eeff5a0d4df27b95405 to your computer and use it in GitHub Desktop.

Select an option

Save Gaurav0/c4a85ffd19620eeff5a0d4df27b95405 to your computer and use it in GitHub Desktop.

Revisions

  1. Gaurav0 revised this gist May 27, 2020. 2 changed files with 18 additions and 1 deletion.
    16 changes: 16 additions & 0 deletions helpers.len2\.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    import Helper from '@ember/component/helper';
    import { observer } from '@ember/object';
    import { tracked } from '@glimmer/tracking';

    export default Helper.extend({
    @tracked
    param: null,

    onMutation: observer('param.[]', function() {
    this.param = [...this.param];
    }),
    compute([param]) {
    this.param = param;
    return param.length;
    }
    });
    3 changes: 2 additions & 1 deletion templates.application\.hbs
    Original file line number Diff line number Diff line change
    @@ -9,4 +9,5 @@
    <input type="text" id="fruitToAdd" value={{this.fruit}} {{on "input" this.updateFruit}} />
    <button {{on "click" this.addFruit}}>Add</button><br>
    <br>
    {{len this.fruits}}<br>
    {{len this.fruits}}<br>
    {{len2 this.fruits}}<br>
  2. Gaurav0 revised this gist May 27, 2020. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion helpers.len\.js
    Original file line number Diff line number Diff line change
    @@ -7,7 +7,7 @@ export default Helper.extend({
    this.recompute();
    }),
    compute([param]) {
    this.param = param;
    this.set('param', param);
    return param.length;
    }
    });
  3. Gaurav0 created this gist May 27, 2020.
    27 changes: 27 additions & 0 deletions controllers.application\.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,27 @@
    import Controller from '@ember/controller';
    import { action } from '@ember/object';
    import { tracked } from '@glimmer/tracking';

    export default class ApplicationController extends Controller {
    appName = 'Ember Twiddle';

    @tracked
    fruits = [
    'apples',
    'oranges',
    'cherries'
    ];

    @tracked
    fruit = '';

    @action
    updateFruit(ev) {
    this.fruit = ev.target.value;
    }

    @action
    addFruit() {
    this.fruits.addObject(this.fruit);
    }
    }
    13 changes: 13 additions & 0 deletions helpers.len\.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,13 @@
    import Helper from '@ember/component/helper';
    import { observer } from '@ember/object';

    export default Helper.extend({
    param: null,
    onMutation: observer('param.[]', function() {
    this.recompute();
    }),
    compute([param]) {
    this.param = param;
    return param.length;
    }
    });
    12 changes: 12 additions & 0 deletions templates.application\.hbs
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,12 @@
    <h1>Welcome to {{this.appName}}</h1>
    <br>
    <br>
    {{#each fruits as |fruit|}}
    {{fruit}}<br>
    {{/each}}
    <br>
    <br>
    <input type="text" id="fruitToAdd" value={{this.fruit}} {{on "input" this.updateFruit}} />
    <button {{on "click" this.addFruit}}>Add</button><br>
    <br>
    {{len this.fruits}}<br>
    23 changes: 23 additions & 0 deletions twiddle\.json
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,23 @@
    {
    "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",
    "ember-data": "3.18.0"
    }
    }