ES6キャッチされない例外TypeError：xxxは次のように私は、モジュールのエントリポイントinit.jsを持っている機能

Question

ないが、

import $ from 'platform!jquery'; 
import angular from 'platform!angular'; 
import ngRoute from 'platform!angular-route'; 
import kendo from 'platform!kendo-ui'; 
import DemoModuleMain from './scripts/app.min'; 

export function render(containerElement, startingRoute, platform) 
{ 
$.ajax({ 
    url: platform.proxyUrl('/content/Default.aspx'), 
    success: function (template) { 
     containerElement.innerHTML = template; 
     DemoModuleMain.main(platform); 
     angular.bootstrap(containerElement, ['myApp']); 
    }, 
    error: function (a, b, error) { 
     containerElement.innerHTML = "Error: " + error; 
    } 
}) 
} 

その後app.min.jsファイル

import UserService from './services/UserService'; 
import UserController from './controllers/UserController'; 
import {UpperFilter, LowerFilter} from './filters/TextFilters'; 
import ClientInformation from './directives/ClientInfo'; 
import ocLazyLoad from '../libs/ocLazyLoad.min.js'; 

class DemoModuleMain 
{ 
constructor(){ 
    alert('init'); 
} 

main(platform){ 
    this._platform = platform; 
    var mainApp = angular.module('myApp', ['ngRoute','oc.lazyLoad']); 
    mainApp.controller('UserController', UserController) 
       .service('UserService', UserService) 
       .filter('upper', UpperFilter) 
       .filter('lower', LowerFilter) 
       .directive('clientInfo', ClientInformation); 

    mainApp.paths = { 
     baseurl: 'extModReq/ngmod/', 
     apiurl:'extModReq/ngmod/content/Default.aspx' 
    }; 

    mainApp.constant('BASE_URL', mainApp.paths.baseurl); 
    mainApp.constant('API_URL', mainApp.paths.apiurl); 

    mainApp.config(function ($routeProvider, BASE_URL) { 
     $routeProvider 
       .when('/Client/:param', { 
        templateUrl: BASE_URL+'content/Client.html' 
       })   
       .otherwise({ 
        redirectTo: '/' 
       }); 
    }); 
    } 
} 

export default DemoModuleMain; 

私は取得していますエラー "Uncaught TypeError：DemoModuleMain.mainは関数ではありません" DemoModuleMain.main（platform）;何が問題なの？

Answer 1

DemoModuleMain.main()を呼び出す場合、mainは静的メソッドである必要があります。 （インスタンスが存在しないため）。ただし、この場合には、あなたがそれのthis内部を使用することはできません。この

class DemoModuleMain { 

    constructor() { 
    alert('init'); 
    } 

    static main(platform) { } 

} 

を試してみてください。だから、DemoModuleMainインスタンスをインスタンス化して、そのmainメソッドを呼び出す必要があります：あなたはmainメソッドを使用する場合は、あなたがあなたのクラスをインスタンス化する必要があります

var demo = new DemoModuleMain() 
demo.main(platform) 

Answer 2

を。

const demo = new DemoModuleMain(); 
demo.main(platform); 

または、メソッドを直接エクスポートしてください。

export function main(platform){ 
    // ... 
} 

名前付きインポートで使用します。

import { main } from './scripts/app.min'; 
main(platform); 

Answer 3

それが静的であるかのようにあなたは、クラス自体にmainメソッドを呼び出しています。クラスをインスタンス化するか、staticキーワードをメソッドに追加する必要があります。しかし、これらのオプションのどちらも本当に理にかなっていません。ここではclassを使用しないでください。ちょうどあなたのinitモジュールのように、関数をエクスポート：

… 
export function main(platform) { 
    var mainApp = angular.module('myApp', ['ngRoute','oc.lazyLoad']); 
    … 
} 

… 
import * as DemoModuleMain from './scripts/app.min'; 
… 
DemoModuleMain.main(platform);