0
我正在構建我的第一個具有CRUD屬性的應用程序。我的index.html的代碼部分看起來像這 -Ember在{output}模板之間切換
<script type = "text/x-handlebars" id = "settings">
<table>
{{#each setting in controller}}
<tr>
<td>
<h2>{{setting.name}}</h2>
</td>
</tr>
<tr>
<td>{{#link-to "setting" setting}}More Details..{{/link-to}}</td>
</tr>
{{/each}}
</table>
{{outlet}}
</script>
<script type = "text/x-handlebars" id = "setting">
{{#if deleteMode}}
<div class="confirm-box">
<h4>Really?</h4>
<button {{action "confirmDelete"}}> yes </button>
<button {{action "cancelDelete"}}> no </button>
</div>
{{/if}}
<div class="col-xs-6">
<h4>{{name}}</h4>
<h4>{{address_line1}}</h4>
<h4>{{address_line2}}</h4>
<h4>{{address_city}}</h4>
<h4>{{address_state}}</h4>
<h4>{{address_zip}}</h4>
<h4>{{address_country}}</h4>
<button {{action "edit"}}>Edit</button>
</div>
<div class = "col-xs-6">
{{outlet}}
</div>
</script>
<script type = "text/x-handlebars" id = "setting/edit">
<div class="input-group">
<h5>Name:</h5>
{{input value=name}}
<h5>Address:</h5>
{{input value=address_line1}}
{{input value=address_line2}}
<h5>City:</h5>
{{input value=address_city}}
<h5>State:</h5>
{{input value=address_state}}
<h5>ZIP:</h5>
{{input value=address_zip}}
<h5>Country:</h5>
{{input value=address_country}}
<button {{action "save"}}> Save </button>
</div>
</script>
當我在setting
模板點擊edit
按鈕時,setting/edit
模板與編輯表單中setting
模板的{outlet}
打開。我想知道如何讓setting/edit
模板取代settings
模板的{outlet}
中的setting
模板,以便它們不出現在同一頁面上?呃開發新的和有點困惑,任何幫助表示讚賞。