Emberを使用します。次のようなビューを選択します。
{{view Ember.Select viewName="select"
contentBinding="view.noseNames"
prompt="Add a Nose:"
selectionBinding="view.noseToAdd"
}}
ユーザーが追加する鼻を選択したら、Ember.Selectをリセットしてプロンプトに戻ります。それ、どうやったら出来るの?set('noseToAdd' null)を試しましたが、Selectを空白の項目に設定するだけです。
質問を示す完全なJSFiddle:
ハンドルバー:
<script type="text/x-handlebars">
{{#view App.PickANose}}
{{view Ember.Select
contentBinding="view.noseNames"
prompt="Add a Nose:"
selectionBinding="view.noseToAdd"
}}
{{/view}}
Picked Noses:
{{#each App.noses}}{{this}}, {{/each}}
</script>
</ p>
JavaScript:
App = Ember.Application.create({
noses: []
});
App.PickANose = Ember.View.extend({
noseNames: ['broken', 'roman', 'hawkish', 'aquiline'],
noseToAdd: null,
aNoseWasPicked: function () {
if (Ember.none(this.get('noseToAdd'))) return;
var noseToAdd = this.get('noseToAdd');
App.get('noses').pushObject(noseToAdd);
// HERE IS THE QUESTION:
// How do I return the select back to "Add a nose:" ?
// The following doesn't work in the latest EmberJS
this.set('noseToAdd', null);
}.observes('noseToAdd')
});