2016-06-12 16 views
0

ng2-bootstrapのdatepickerを使用しています。角度2 ng2-bootstrap datepicker systemjs 404エラー

https://valor-software.com/ng2-bootstrap/#/datepicker

私は私のコンポーネントでDATEPICKER_DIRECTIVESをインポートした

import { DATEPICKER_DIRECTIVES } from './../../../node_modules/ng2-bootstrap/components/datepicker'; 

directives: [DATEPICKER_DIRECTIVES], 

とディレクティブのリストに追加し、その後、私のテンプレートで私はこのようにそれを使用しています:

<datepicker [(ngModel)]="dt" [minDate]="minDate" [showWeeks]="true"></datepicker> 

マイsystemjsの構成は次のようになります。

var map = { 
     'app': 'content/app', 
     'rxjs': 'node_modules/rxjs', 
     '@angular': 'node_modules/@angular', 
     "angular2-masonry": "node_modules/angular2-masonry", 
     'datepicker': 'node_modules/ng2-bootstrap/components/datepicker' 
    }; 

var paths = { 
     "masonry-layout": "node_modules/masonry-layout/dist/masonry.pkgd.js", 
     'datepicker': 'node_modules/ng2-bootstrap/components/datepicker/datepicker.component.js', 
    }; 


var packages = { 
     'app': { main: 'main.js', defaultExtension: 'js' }, 
     'rxjs': { defaultExtension: 'js' }, 
     "angular2-masonry": { defaultExtension: 'js', main: "index" }, 
     'datepicker': { defaultExtension: 'js', main: "datepicker.component" } 
    }; 

var angularPackages = [ 
    '@angular/common', 
    '@angular/compiler', 
    '@angular/core', 
    '@angular/http', 
    '@angular/platform-browser', 
    '@angular/platform-browser-dynamic', 
    '@angular/router' 
]; 

angularPackages.forEach(function (pkgName) { 
    packages[pkgName] = { 
     main: 'index.js', defaultExtension: 'js' 
    }; 
}); 


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

    System.config(config); 

すべてがエラーなしでコンパイルが、私は、ブラウザでそれを実行すると、コンソールにエラーの下に表示されます。

/content/node_modules/ng2-bootstrap/components/datepicker 404 (Not Found) 

それは、なぜ私はわかりません/ content/node_modules/ng2-bootstrap/components/datepickerのdatepickerを探していますが、node_modules/ng2-bootstrap/components/datepickerを調べるように指定しました。あなたのindex.htmlにNG2-ブートストラップライブラリーを含めて確認する必要があり

+0

はどのようにあなたの現在のファイル内の他のコンポーネントの輸入をしているの?例えば、 '@ Component/Core'から 'import {Component}'としましょう;これはあなたがやっているのですか?そして、私は簡単な提案をしています。なぜ、angular2の開発にangular-cliを使用しないのですか? –

+0

'@ angular/core'のimport {Component}とまったく同じようにしています。 、Angi-cliはASP.Net MVCプロジェクト(ビジュアルスタジオ)でも動作しますか? –

+0

私はASP.NETの人ではありませんが、ASP.NETとは関係ありません。任意のバックエンド言語でAPIを作成すると、フロントエンドのangular2プロジェクトに必要なAPIが提供されます:) btw node_modulesのフォルダ構造のスクリーンショットを与えることができます –

答えて

0

<script src="node_modules/ng2-bootstrap/bundles/ng2-bootstrap.min.js"></script> 
+0

まだ問題は解決していません – Saineshwar

関連する問題