私の Ember.js アプリは、おおよそ次のように設定されています。
ルーター:
App.Router.map ->
@resource('site', { path: '/' }, ->
@resource('dashboard')
@resource('account')
@resource('pages', { path: '/:page_slug'}))
ルート:
App.ApplicationRoute = Ember.Route.extend
model: ->
return App.Site.find(1)
App.PagesRoute = Ember.Route.extend
model: (params)->
return App.Page.find(params.page_slug)
編集:
コントローラー (コーヒーではなく JS):
App.PagesController = Ember.ObjectController.extend({
needs: 'ApplicationController',
...
});
ApplicationController と PagesController があります。ページにいるときに、アクションを呼び出して現在のページを削除したいと考えています。PagesController に配置すると問題なく動作しますが、ApplicationView 内のページのリストを含むナビゲーション メニューは、ページを更新するまで更新されません。だから... ApplicationControllerにアクションを配置needs: ['ApplicationController']
し、PagesControllerに追加する必要があると思います。
ただし、これを行うと、Pages テンプレートのすべてが消えてしまいます。
アプリケーション テンプレートに1{{outlet}}
つと、最終的にページ テンプレートを表示するサイト テンプレートに 1 つがあります。ええ、複雑です、私は知っています、そしておそらくそれを行うより良い方法があるので、どんな提案も大歓迎です. ああ、ところで、私は本当の Ember.js 初心者なので、例は明示的に綴る必要があります。(クレヨンできれいな色で描くのが理想です。)
助けてくれてありがとう。
ここでリフレッシュの問題です。ルート リソースsite
では、送信された URL を使用して Rails バックエンドが返す 1 つのモデルを読み込んでSite
います。最終的に、このアプリは複数のドメインで使用され、各ドメインは独自の Web サイトで提供されます (大まかに WP-マルチサイトのコンセプト)。次にルートで、属性pages
に基づいてサイトの 1 ページを読み込みます。slug
それはすべてうまくいっています。そのため、ユーザーが必要に応じてページを追加および削除できるようにしたいと考えています。
というわけで、本題はこれ。レベルでページを削除すると、ページはPagesController
問題なく削除されますが、ApplicationController には通知されません。つまり、私のナビゲーション メニュー:
<ul class="left">
{{#each page in page}}
<li>{{#link-to 'pages' page.slug}}{{page.menu_name}}{{/link-to}}</li>
{{/each}}
<li id="add-page-button"><a data-tooltip title="Click here to add a new page to your site." href="#" data-reveal-id="addPageModal" data-reveal>+</a></li>
</ul>
はページが見つからないという通知を受け取らないため、そのページをリストから削除してナビゲーション メニューを更新しません。追加は正常に機能し、新しいページが追加されるとナビゲーションリストが更新されますが、次のApplicationController
ようなレベルでそれを行っています:
addNewPage: ->
# Get the site
site = @get('model')
# Get all the pages associated with the site
pages = site.get('page')
title = this.get('newTitle')
if (!title.trim())
return
slug = this.get('newSlug')
if (!slug.trim())
return
menu_name = this.get('newMenuName')
if (!menu_name.trim())
return
# Create a new page passing in our title, slug and menu_name
pages.create({title: title, slug: slug, menu_name: menu_name})
# Save the pages
pages.save()
if (pages.isError)
console.log(pages.errors)
else
@set('newTitle', '')
@set('newSlug', '')
@set('newMenuName', '')
$('#addPageModal').foundation('reveal', 'close')
そして、これは私のdeletePage
コードですPagesController
(申し訳ありませんが、JSとCoffeeScriptが混在しています):
deletePage: function (slug) {
var page = this.get('model');
this.get('ApplicationController').deletePage(page);
this.toggleProperty('isEditingTitle');
this.toggleProperty('isShowingDeleteConfirmation');
this.transitionToRoute('site.index');
}
これを試してみると、Ember は追加する必要があることを知らせてくれますが、追加するneeds
と、Pages テンプレートが空白になります。
そうそう、アクションtarget
を呼び出すボタンに属性を設定しようとさえしました。deletePage
私がしなければならないことは、どうにかSite
して自分のモデルにアクセスすることPagesController
だと思いますが、どうすればよいでしょうか。
この投稿は壮大な割合を占めています。申し訳ありません。助けてくれてありがとう。