Skip to content

Instantly share code, notes, and snippets.

@arenoir
Last active February 6, 2019 23:50
Show Gist options
  • Save arenoir/0b13c4ed2a8ba0a738edce592c283b44 to your computer and use it in GitHub Desktop.
Save arenoir/0b13c4ed2a8ba0a738edce592c283b44 to your computer and use it in GitHub Desktop.
New Twiddle
import Ember from 'ember';
export default Ember.Controller.extend({
appName: 'Ember Twiddle',
value: null,
bad: null,
options: [
{ value: 'value1', label: 'label1' },
{ value: 'value2', label: 'label2' },
{ value: 'value3', label: 'label3' },
]
});
<h1>Welcome to {{appName}}</h1>
<br>
<br>
{{outlet}}
<br>
<br>
<h3>This select works and its value is: {{value}}</h3>
<XSelect @value={{value}} @onChange={{mut value}} as |xs|>
{{#each options as |opt| }}
<xs.option @value={{opt.value}}>{{opt.label}}</xs.option>
{{/each}}
</XSelect>
<h3>This select has id and doesn't work and its value is: {{bad}}</h3>
<XSelect @value={{bad}} @onChange={{mut bad}} as |xs|>
{{#each options as |opt| }}
<xs.option @value={{opt.value}}>{{opt.label}}</xs.option>
{{/each}}
</XSelect>
{
"version": "0.15.1",
"EmberENV": {
"FEATURES": {}
},
"options": {
"use_pods": false,
"enable-testing": false
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js",
"ember": "3.4.3",
"ember-template-compiler": "3.4.3",
"ember-testing": "3.4.3"
},
"addons": {
"emberx-select": "4.0.0-beta"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment