問題タブ [ember-components]

私は EmberJs 1.13.15 と Ember-CLI を使用して、次のコードを追加してメインの LinkComponent の動作をわずかに変更しようとしていました:

app/components/nav-link-to.js:

app/templates/components/nav-link-to.hbs:

そして、このコンポーネントを次の場所で使用しています：

app/templates/nav-bar.hbs:

しかし、ブラウザーで nav-bar テンプレートを開くたびに何も表示されず、ember インスペクターのコンソールに次のエラーが表示されます

キャッチされていない TypeError: 未定義のプロパティ 'slice' を読み取ることができません

何か助けはありますか？

前もって感謝します。

Web サイトの音楽ページ内で、SoundCloud API から取得したお気に入りの曲を再生する音楽コンポーネントがあります。

問題は、曲を再生してウェブサイトのページ（ルート）を変更すると、曲が再生され続けるため 、ページisPlaying falseの音楽を変更するたびに設定する必要がrouteあることです。

それを達成するにはさまざまな方法があることがわかりますが、私の場合はわかりません

ミが試みる

別のコントローラーから

または別のルートから

設定できない 2 つの関数のいずれかでisPlaying false、ルート アクションについても言及されていwillTransitionますが、どのように使用できますか? それを行うより良い方法はありますか？必要に応じて、シナリオをよりよく再現するためにひねりを加えることができます

基本的に、削除アクションに視覚化を追加しようとしています。

そして、コードは次を使用しています：

そのため、removeRecord アクションがトリガーされ、レコードがWrappedRecordsから削除されます。

そして今、フェード要素コンポーネントのラッパーに。willDestroyElementコンポーネントの破棄をフックでキャッチします。

ただし、次を置き換えると機能しません。

clone.insertAfter(this.$());とclone.insertAfter(this.$().parent());

それは機能しますが、新しい問題が発生します。例えば：

2つのアイテムがあり、最初のアイテムを削除しようとすると、次のようになります

X1 (削除する) X2 (2 番目の要素) X1 (親に追加されたクローン)

ライブデモへのリンク

https://ember-twiddle.com/ef8c4bcdcd8d2eb5b5c4?openFiles=fade-element.component.js%2Cfade-element.template.hbs

配列で Ember コンポーネント (例: ボタン) を使用しています。

そして、ボタンのコンポーネント アクションは pressButton(eg) です。

ただし、従業員のリストがレンダリングされる場合(例):

アリス |昇進| マーク|宣伝| テスラ |宣伝|

ボタンをクリックして従業員 (従業員マークなど) を昇進させます。バブルアップされる emp_id はアリス (常にリストの最初の従業員のもの) (マークではありません) です。どこに行くのか教えてもらえますか?ここで間違っていますか？

ember s を実行すると、次の結果が得られます。

これらのファイルは手動で作成し、ember g は使用しませんでした。これが私のコンポーネントの hbs および js ファイルです。

hbs ファイル:

js ファイル:

どちらも ../templates/components ディレクトリにあります。

私が間違っていることは何ですか？このコンポーネントは予約名か何かですか? 道に迷いました！

現在、モーダル ポップアップのマークアップを生成する Ember コンポーネントがあります。モーダルのコンテンツ本文に割り当てられる HTML を (コンポーネント属性の形式で) コンポーネントに渡したいと思います。次のようなものが理想的です。

ルート テンプレート: app/templates/section1.hbs

モーダル テンプレート: app/components/my-modal/template.hbs

モーダルの本文に表示したいコンテンツは静的で、現在のテンプレートに固有です。

myContent可能であれば、この html をコントローラーに設定したり、ルートのモデル フックに設定したりしたくありません。

更新: さらに、Blockブロック間を行き来する必要がある HTML が非常に多く、メイン テンプレート マークアップのフローが中断されるため、params/syntax を使用しないこともお勧めします。

理想的には、この html をルートのテンプレートに設定するだけで済みます。現在、これは私の回避策であり、目的の要素の後に JavaScript テンプレートを追加する必要がありますdidInsertElement。

ローカルのhandlbersテンプレート変数を(app/templates/section1.hbs内の)htmlに設定するなど、これを達成するためのより良い方法はありますか?

現在の解決策/回避策:

ルート テンプレート: app/templates/section1.hbs

コンポーネント JS: app/components/my-modal/component.js

モーダル テンプレート: app/components/my-modal/template.hbs