無法添加NG2，兌現到github.com/angular/quickstart

Question

我嘗試添加github.com/sherweb/ng2-materialize到github.com/angular/quickstart下面改變

"materialize-css": "", 
"mdi": "", 
"jQuery": "", 
"ng2-materialize": "", 
//in Package.json 'dependencies' and 'devDependencies' 

systemjs.config.js Image, code below

'jquery':     'npm:jquery', 
    'materialize-css':   'npm:materialize-css', 
    'mdi':      'npm:mdi', 
    'ng2-materialize':   'npm:ng2-materialize', 

請檢查器件和模塊image here, code below的組件和模塊

組件

import { MaterializeModule } from 'ng2-materialize'; 

模塊

@Component({ selector: 'my-app', template: ` 
      <h1>Hello {{name}}</h1> 
      <div class="card-panel teal lighten-2">This is a card panel with a teal lighten-2 class</div> 
      `, }) export class AppComponent { name = 'Angular'; } 

，但我正確地收到錯誤和itsnot裝載

[0] 1:10:56 PM - Compilation complete. Watching for file changes 
[1] 17.02.26 13:10:57 200 GET /main.js 
[1] 17.02.26 13:10:57 304 GET /@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js 
[1] 17.02.26 13:10:57 200 GET /app/app.module.js 
[1] 17.02.26 13:10:57 304 GET /@angular/compiler/bundles/compiler.umd.js 
[1] 17.02.26 13:10:57 304 GET /@angular/core/bundles/core.umd.js 
[1] 17.02.26 13:10:57 304 GET /@angular/platform-browser/bundles/platform-browser.umd.js 
[1] 17.02.26 13:10:57 200 GET /app/app.component.js 
........ 
[1] 17.02.26 13:10:57 404 GET /node_modules/ng2-materialize/ 

沒有兌現它的加載，它不僅拿起外接Materialise的設計模塊，它也做的NPM開始 - 沒有錯誤除了上述

Answer 1

我有同樣的問題。作爲變通方法，您可以使用下面的代碼

文件：systemjs.config.js

var packages = { 
    ... 
    'ng2-materialize': { 
     main: 'dist/index.js' 
    } 
    ... 
}; 

var paths = { 
    'npm:': 'node_modules/' 
}; 

map = { 
... 
    'ng2-materialize': 'npm:ng2-materialize' 
... 
} 

var ngMaterializePackageNames = [ 
     'button', 
     'card', 
     'checkbox', 
     'collapsible', 
     'dropdown', 
     'input', 
     'navbar', 
     'parallax', 
     'progress', 
     'radio-button', 
     'icon', 
     'select', 

     'sidenav', 
     'sidenav/sidenav-collapsible', 
     'sidenav/sidenav-divider', 
     'sidenav/sidenav-header', 
     'sidenav/sidenav-link', 
     'sidenav/sidenav-subheader', 

     'spinner', 
     'textarea', 
     'tooltip', 

     'toast', 
     'toast/services' 
    ]; 

function packMaterialize(pkgName) { 
     packages['ng2-materialize/dist/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; 
    } 

ngMaterializePackageNames.forEach(packMaterialize); 

var config = { 
     map: map, 
     paths: paths, 
     packages: packages 
}; 

System.config(config);