使用systemjs导入位于应用程序文件夹外的共享服务,该应用程序位于typescript中的angular 2应用程序中

时间:2016-07-23 04:36:10

标签: typescript angular systemjs

我在以下结构中有两个角度2应用程序:

/应用
/ APP1
/ APP 2
/共享

在我的angular 2组件(用typescript编写)中,我导入了几个模块(位于同一个文件夹中),没有任何问题: 从'./test1.service';

导入{TestService1}

但是,当我尝试从共享文件夹导入某些内容时,它无法在运行时(浏览器)加载所需的模块。 从'../shared/test2.service'导入{TestService2}; 浏览器显示:http://something.something.darkside/app/test2.service 404(未找到)。

我可以使用defaultJSExtensions设置为true,这将解决问题。但我想知道如何正确配置systemjs来处理这种情况。

systemjs.config.js

(function (global) {

    var ngPackageNames = [ bla, ng2packages... ];

    //ng2 apps
    var ngApps = [
        '/app/app1',
        '/app/app2'
    ];

    var map = {
        '@angular': '/node_modules/@angular',
        'rxjs': '/node_modules/rxjs'
    };

    var packages = {
        'rxjs': { defaultExtension: 'js' }
    };

    //adds package entries for each of the needed ng2 packages
    ngPackageNames.forEach(function (pkgName) {
        packages['@angular/' + pkgName] = System.packageWithIndex
            ? { main: 'index.js', defaultExtension: 'js' }
            : { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
    });

    //adds map entries and package entries for the apps
    ngApps.forEach(function (app) {
        var appName = app.substring(app.lastIndexOf('/') + 1);
        map[appName] = app;
        packages[appName] = { main: appName + '.main.js', defaultExtension: 'js' };
    });

    System.config({ map: map, packages: packages });

})(this);

2 个答案:

答案 0 :(得分:4)

包含地图对象的文件夹路径。

    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

      API1();
      API2();
      API3();
      API4();
      API5();
   }

    // all the Apis are call in onCreate

  public void API1() {
            FetchData fetch = new FetchData(this);
            fetch.response = new FetchListener() {
        @Override
        public void fetchFinish(String output) {
            try {
                JSONObject jobjOUT = new JSONObject(output);

                JSONArray jsarray = jobjOUT.getJSONArray("details");

                for (int i = 0; i < jsarray.length(); i++) {
                    JSONObject obj = jsarray.getJSONObject(i);
                    String a = obj.getString("abc");
                }

            } catch (Exception e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
        }
    };
    try {
        fetch.execute("http://example.com/api/something.php?param=xyz");
    } catch (Exception e) {
        // TODO Auto-generated catch block
        e.printStackTrace();
    }

  }
  public void API2() {
     // same code here
  }
  public void API3() {
     // same code here
  }
  public void API4() {
     // same code here
  }
  public void API5() {
     // same code here
  }

 }

添加包添加

var map = {
    'shared' : 'app/shared',
    '@angular': '/node_modules/@angular',
    'rxjs': '/node_modules/rxjs'
};

答案 1 :(得分:-1)

**User "defaultJSExtensions": true in system.config.js**


    (function (global) {
       System.config({
        paths: {
            'npm:': 'node_modules/'
           },
        "defaultJSExtensions": true,
         map: {