Created
July 28, 2021 15:43
-
-
Save sukima/1780a8fd7b26b7e927193e5746c8b3e0 to your computer and use it in GitHub Desktop.
Vanilla Select in out-of-box Ember
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Controller from '@ember/controller'; | |
import { tracked } from '@glimmer/tracking'; | |
import { action } from '@ember/object'; | |
export default class ApplicationController extends Controller { | |
@tracked selected = 2; | |
get isSelected() { | |
// The {{get}} helper will coerce values to strings. Thus | |
// an POJO lookup works even if the type is a number. | |
return { [this.selected]: true }; | |
} | |
@action | |
update({ target }) { | |
// This is where you convert a string version of the data | |
// to the type associated with the data. In this example | |
// it is a number associated to the index of the options | |
// array used in the {{#each}} block. It could easily be | |
// a model ID. | |
this.selected = parseInt(target.value, 10); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"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" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment