ExtJS TreeGrid + MVC - 読み込みません

Question

私はMVCの紹介（http://dev.sencha.com/deploy/ext-4.0.7-gpl/docs/index.html#!/guide/application_architecture）を取ってきて、代わりにツリーグリッドをロードしようとしました。ここの例の助けを借りて（http://dev.sencha.com/deploy/ext-4.0.0/examples/tree/treegrid.html）助けてください。

理由はわかりませんが、負荷がかかりません。それはExt.applicationの起動機能には決して到達しません。私は、コントローラが正しく設定されていないことを想定していますが、Firebugはコンソールにエラーを表示していないので、少し失われます。何が価値があるために

、私はコピーしてTreeGridの例を自分でロードされ、それが動作しますので、私はそれがこのスレッドからだろうと思ったようにそれは、ExtJSのバグ/サーバ設定の問題ではありませんしました：Configuration required to get Sencha ExtJS TreeGrid example working

マイコード： main.js

Ext.Loader.setConfig({ enabled: true }); 

Ext.require([ 
    'Ext.data.*', 
    'Ext.grid.*', 
    'Ext.tree.*' 
]); 

Ext.application({ 
    name: 'pr', 

    appFolder: '', //This is considered root so no name needs to be supplied. 

    controllers: [ 
     'Control-Product' //filename 
    ], 

    launch: function() { 
     console.log('The app was launched'); 
     Ext.create('Ext.container.Viewport', { 
      layout: 'fit', 
      items: [{ 
       xtype: 'treegrid' 
      }] 
     }); 
    } 
}); 

コントロール-Product.js

Ext.define('pr.controller.Product', { 
    extend: 'Ext.app.Controller', 
    views: ['user.TreeGrid'], 
    stores: ['Store-Products'], 
    models: ['Model-Product'], 

    init: function() { 
     console.log('The controller was instantiated'); 
     this.control({ 
      'viewport > panel': { 
       render: this.onPanelRendered 
      } 
     }); 
    }, 
    onPanelRendered: function() { 
     console.log('The panel was rendered'); 
    }  
}); 

TreeGrid.js

012私の同僚とそれを通じ実行した後

Ext.define('pr.view.user.TreeGrid', { 
    extend: 'Ext.tree.Panel', 
    alias: 'widget.treegrid', 

    initComponent: function() { 
     this.title = 'Products', 
     this.store = 'pr.store.Products', 
     this.collapsible = true, 
     this.useArrows = true, 
     this.rootVisible = false, 
     this.multiSelect = true, 
     this.singleExpand = false, 
     //this.renderTo = Ext.getBody(), 
     this.columns = [{ 
      xtype: 'treecolumn', 
      text: 'ID', 
      flex: 1, 
      dataIndex: 'ID', 
      sortable: true 
     }, 
     { 
      text: 'Price', 
      flex: 1, 
      dataIndex: 'Price', 
      sortable: true 
     }, 
     { 
      text: 'Company', 
      flex: 1, 
      dataIndex: 'Company', 
      sortable: true 
     }]; 

     this.callParent(arguments); 
    } 
}); 

モデルProduct.js

Ext.define('pr.model.Product', { 
    extend: 'Ext.data.Model', 
    fields: [ 
      { name: 'ID', type: 'string' }, 
      { name: 'Price', type: 'string' }, 
      { name: 'Company', type: 'string' } 
     ] 
}); 

ストアProducts.js

Ext.define('pr.store.Products', { 
    extend: 'Ext.data.TreeStore', 
    model: 'pr.model.Product', 
    proxy: { 
     type: 'ajax', 
     //get data from json file for now 
     url: '/data/products.json' 
    }, 
    folderSort: true 
}); 

products.json

{"text":".","children": [ 
    { 
     ID:'1111', 
     Price:'11.11', 
     Company:'Company1',   
     expanded: true, 
     children:[{ 
      ID:'', 
      Price:'44.44', 
      Company:'Company2', 
      leaf:true 
      }]   
    },{ 
     ID:'2222', 
     Price:'22.22', 
     Company:'Company1',   
     expanded: true, 
     children:[{ 
      ID:'', 
      Price:'33.33', 
      Company:'Company3', 
      leaf:true 
      }] 
    } 
]} 

Answer 1

それが判明私は私のクラスネームを私のファイル名にマッチさせるために名前をつけていませんでした。 pr.model.Productはpr.model.Model-Productである必要があります。これが修正され、すべて動作しています。