Skip to content

Instantly share code, notes, and snippets.

@n1ru4l
Last active September 14, 2017 16:42
Show Gist options
  • Save n1ru4l/37f6913eace580532791ba4e6daf56c8 to your computer and use it in GitHub Desktop.
Save n1ru4l/37f6913eace580532791ba4e6daf56c8 to your computer and use it in GitHub Desktop.
IT STILL WORKS
import Ember from 'ember'
const { Component } = Ember
export default Component.extend({
// props
availableItems: undefined,
selectedItem: undefined,
onSelectItem: undefined,
})
import Ember from 'ember'
const {
A: EmberArray,
set,
get,
} = Ember
const availableItems = EmberArray([
{ id: 1, label: `The` },
{ id: 2, label: `Video` },
{ id: 3, label: `is` },
{ id: 4, label: `not` },
{ id: 5, label: `deprecated` },
])
export default Ember.Controller.extend({
availableItems: undefined,
selectedItem: undefined,
init(...args) {
this._super(...args)
set(this, `availableItems`, availableItems)
const selectedItem = availableItems.objectAt(3)
set(this, `selectedItem`, selectedItem)
},
actions: {
setSelectedItem(itemId) {
const availableItems = get(this, `availableItems`)
itemId = parseInt(itemId, 10)
const selectedItem = availableItems.find(item => get(item, `id`) === itemId)
set(this, `selectedItem`, selectedItem)
}
},
})
import Ember from 'ember'
export function isEqual(params) {
return params[0] === params[1]
}
export default Ember.Helper.helper(isEqual)
<h1>Shoop da whoop</h1>
{{lq-select
availableItems=availableItems
selectedItem=selectedItem
onSelectItem=(action "setSelectedItem")
}}
<br>
Selected Item: {{selectedItem.label}} with id {{selectedItem.id}}
<select
onchange={{action onSelectItem value="target.value"}}
>
{{#each availableItems
key="id"
as |item|
}}
<option
value={{item.id}}
selected={{is-equal item selectedItem}}
>
{{item.label}}
</option>
{{/each}}
</select>
{
"version": "0.12.1",
"EmberENV": {
"FEATURES": {},
"EXTEND_PROTOTYPES": false
},
"options": {
"use_pods": false,
"enable-testing": false
},
"dependencies": {
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
"ember": "2.12.0",
"ember-template-compiler": "2.12.0",
"ember-testing": "2.12.0"
},
"addons": {
"ember-data": "2.12.1"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment