0

ここに示すように、イベントアグリゲーターを使用するためにAppインスタンスを含めようとしています

インスタンスをビューに含めるとエラーが発生します。

App.Bootloader.jsからのRequirejs構成ファイルで物事を開始します。

require(['App'], function (App){
      App.start();
      });

App.jsから：

define(function (require){

  //...requisite includes $, _, Backbone, Marionette ...

var Layout = require('Layout');

  var App = new Marionette.Application();

        App.addRegions({
            main: '#view_content'
        });

        App.addInitializer(function (){

                App.main.show(new Layout());
                //... adding router etc ...    

                Backbone.Marionette.TemplateCache.loadTemplate = function (template, callback){
                   callback.call(this, Handlebars.compile(template));
                };
                Backbone.history.start();

        });

    return App;
});

Layout.jsから：

define(function(require){
   var View = require('folder/folder/View');
   //template contains #sub div
   var template = require('text!template.html');

   return Marionette.Layout.extend({
      template: template,
      regions: {
         sub: '#sub'
      },
      initialize: function(){
         //wait till template is rendered in dom
         _.defer(function(region){
             region.sub.show(new View());
          }, this)
      }

   });

});

/folder/folder/View.jsから：

define(function (require){

      //...requisite includes $, _, Backbone, Marionette ...

     var App = require('App');
     return Marionette.ItemView.extend({});
});

「'エラー：モジュール名'アプリ'はコンテキスト用にまだロードされていません：_」というエラーが表示される場所

何か案は？Lemmeは、さらに情報が必要かどうかを知っています。

4

4 に答える 4

5

また、マリオネットとrequire.jsを使用して、この種の状況に対処する良い方法を探しています

私は解決策に取り組みましたが、それが最善の方法であるかどうかはわかりません。ここに私の考えがあります：

  • アプリケーションは、ビューを認識せずにイベントに関連付けられたアクションを持っています
  • ビュー内では、トリガーを使用してアクションをイベントに関連付けます
  • ビューとアプリケーション間のアクションの接続は、ビュー内で行われます

これは可能な解決策です：

app.js

define( [ 'underscore', 'jquery', 'backbone', 'marionette' , 'view'], 
    function( _, $, Backbone, Marionette, View  ) {

    var app = new Marionette.Application();
    app.addRegions({ content: '#content'})

    app.on( "initialize:after", function(){

        console.log( 'after init', app)

        var view = new View();
        app.content.show( view );

    });

    // this is the action that we would like to call from the view      
    app.vent.on( 'viewClick', function(){ console.log( 'clicked on view' )})

    return app;
});

view.js

define( [ 'underscore', 'jquery', 'backbone', 'marionette' ], 
    function( _, $, Backbone, Marionette ) {

    var View = Marionette.ItemView.extend({
        template: '#view',

        triggers: {
            'click': 'clicked'
        },

        initialize: function(){

            // thisView will be referring to the view instance
            var thisView = this;

            // we require the app because we need access to the event aggregator 
            require(['app'], function( app ){

                // when our event is triggered on our view
                thisView.on( 'clicked', function(){ 
                    // we trigger an event on the application event aggregator
                    app.vent.trigger( 'viewClick' )
                });
            });
       }
    })

    return View
});

require は非同期であることを覚えておくことが重要です。したがって、このように使用すると、すぐには実行されません。

require( ['some-module'], function( someModule ){ 
   // do something, but only as soon as someModule is loaded 
});

次のように、外部コンテキストを指すオブジェクトを準備できます。

var thisName = this;
require( ['some-module'], function( someModule ){ 
   // access to external this using thisName
});
于 2012-07-07T02:04:09.093 に答える
3

循環依存に問題があると思います。AppニーズViewとViewニーズApp。うーん…でもなぜView必要なのApp？私はあなたのコードからそれを理解することはできません。結局、本当にView必要Appですか？ちなみに、タイプミスだと思います。最初From /folder/folder/View.jsはおそらくFrom Layout.jsです。

于 2012-06-16T00:25:49.930 に答える
0

user1248256 が正しいです。私も同じ問題を抱えていました。私のアプリにはコントローラーが必要で、コントローラーにはアプリが必要でした。

オプションの一部としてコントローラー (コードのビュー) を渡すことで、それを require.js 定義に追加する必要がなくなります。

//data-main:
define(function(require) {
    var   $                 = require("jquery"),
        _                   = require("underscore"),
        App                 = require("app/App"),
        PublicRouter        = require("routers/DesktopRouter"),
        PublicController    = require("routers/publicController");

    var options = {
        publicController  :   PublicController,
        publicRouter      :   PublicRouter

    }

    App.start(options);
});

アプリでは、PublicController を「要求」する必要はありません

//App:
define(['jquery', 'backbone', 'marionette', 'underscore'],
function ($, Backbone, Marionette, _) {
    var App = new Marionette.Application();
    ...snip...
        console.log("Creating Routers");
        App.Routers = {};
        // Connect controllers to its router via options
        // init router's router/controller
        App.Routers.publicRouter = new options.publicRouter.Router({
            controller: options.publicController
        });
    });

それが役立つことを願っています。

アンドリュー

于 2013-06-05T15:48:53.657 に答える
0

一般的に、requireJS を使用するときにアプリの EventAggregator を使用するのは悪い習慣だと思いますが、それ以外の理由がなくても、循環参照が簡単に発生してしまうからです。

App、View、および Layout で必要となる可能性のある個別の EventAggregator モジュールを定義し、それを必要とするモジュールの依存関係に追加するだけです。

于 2014-08-21T20:17:14.967 に答える