2

テンプレートから参照する View サブクラス MenuitemView を定義しました (以下を参照)。しかし、エンバーはそれを見つけられません。このエラーが発生し続けます: エラー: アサーションに失敗しました: パス 'App.MenuitemView' でビューが見つかりません。私は何が欠けていますか？

初期化コード:

window.require.register("initialize", function(exports, require, module) {
  var App;
  App = require('app');
  App.Router.map(function(){});
  require('routes/IndexRoute');
  require('templates/menuitem');
  require('templates/application');
  require('templates/index');
  App.initData();
});

ビューの定義:

window.require.register("views/MenuItemView", function(exports, require, module) {
  var App;
  App = require('app');
  module.exports = App.MenuitemView = Em.View.extend({
    templateName: 'menuitem',
    visibility: function(){
      if (App.selectedDishType && !App.selectedDishType === this.get('dish').get('type')) {
        return 'invisible';
      } else {
        return '';
      }
    }
  });
});

ビューを参照するテンプレート (templates/index.hbs):

{{#each item in content}}
    {{view App.MenuitemView itemBinding=item}}
{{/each}}

ビュー テンプレート (templates/menuitem.hbs)

<div class="dishitem">
    <div class="dishimage">
        {{thumbnail item.dish.identifier}}
    </div>
    <div class="dishdetails">
        <p class="dishname">{{uppercase item.dish.name}}</p>
        <p class="dishdescription">{{item.dish.description}}</p>
        <ul class="packages">
        {{#each package in item.packages}}
            <li>
                <span class="packageprice">€ {{package.price}}</span>
                <span class="packagespec">
                    {{#if package.description}}({{package.description}}){{/if}}
                </span>
            </li>
        {{/each}}
        </ul>
    </div>
</div>
4

3 に答える 3

2

この問題は、アプリケーションの構築に Brunch を使用していて、すべての JavaScript コンポーネントとテンプレートが別々のファイルにあることが原因で発生しました。その後、Brunch はテンプレートをコンパイルして common.js javascript モジュールを分離します。テンプレートのコンパイル済みモジュールのコードは、ビュー モジュールで定義されたビューにアクセスできません。このような依存関係を通常処理する方法は、依存モジュールの JavaScript に「require('my-other-module')」を追加することです。しかし、私のテンプレートソースはjavascriptではなくハンドルバーなので、これをソースに追加することはできません. 解決策は、アプリケーションの名前空間がグローバルに利用できるようにすることです。これを行うには、アプリケーションの初期化コードをモジュールに配置しないでください。たとえば、スクリプト タグ内の html に直接配置します。

<script>
App = require('app');
</script>
于 2013-05-29T05:32:28.200 に答える
0

私が気付いたのは、menuitemview の「項目」の部分が大文字 (views/MenuItemView) の場合もあれば、小文字の場合もあるということです。それがエラーメッセージの原因でしょうか？

于 2013-05-27T11:29:55.107 に答える
0

私は ember-tools で同様の問題に遭遇し、受け入れられた答えが私を正しい道に導きました. 後世のためにここに私の解決策を残します。

私は自分のアプリを次のように設定しました：

var FooRoute = Ember.Route.extend({
  ...
  renderTemplate: function() {
    this.render();
    this.render('Bar', {into: 'foo', outlet: 'bar', controller: 'foo' });
  },
  ...
});

そしてテンプレートでfoo.hbs：

{{outlet bar}}

これは、@RudiAngelaが受け入れられた回答で言及したのと同じ種類の理由で問題を引き起こしていました。ただし、タグを含める代わりに<script>、{{outlet}} を {{view}} に変更しただけです。

{{view App.Bar}}

これで問題は解決しました。

于 2013-08-22T18:39:00.667 に答える