角度安装模块2

Question

我想要在我的角度2应用程序中运行ngx-date-picker。

安装说明看起来很稀疏，演示不存在，所以我正在以蜗牛的速度戳穿它。

我们使用纱，所以我跑纱下面node_modules的文件夹添加NGX-日期选择器--save，现在我在那里有一个/ NGX-日期选择器/文件夹中。

我已经去到的package.json和添加的组件，但我真的不知道，如果我有语法正确：

{ 
    "name": "arv2", 
    "version": "0.0.0", 
    "license": "MIT", 
    "scripts": { 
    "ng": "ng", 
    "build-prod": "set NODE_ENV=production && webpack", 
    "watch-build": "webpack --progress --colors --watch", 
    "lint": "ng lint", 
    "i18n": "ng-xi18n --i18nFormat=xlf", 
    "publish-prod": "yarn run build-prod && yarn run publish", 
    "publish": "dotnet publish -o \"..\\Publish\\leaves\"", 
    "build": "webpack", 
    "start": "webpack-dev-server --port=4200", 
    "test": "karma start ./karma.conf.js", 
    "prepree2e": "npm start", 
    "pree2e": "webdriver-manager update --standalone false --gecko false --quiet", 
    "e2e": "protractor ./protractor.conf.js" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/common": "^4.0.0", 
    "@angular/compiler": "^4.0.0", 
    "@angular/core": "^4.0.0", 
    "@angular/forms": "^4.0.0", 
    "@angular/http": "^4.0.0", 
    "@angular/platform-browser": "^4.0.0", 
    "@angular/platform-browser-dynamic": "^4.0.0", 
    "@angular/router": "^4.0.0", 
    "@ngx-translate/core": "^7.0.0", 
    "@ngx-translate/http-loader": "^0.1.0", 
    "ngx-date-picker": "^0.0.0", 
    "angular2-jwt": "^0.2.3", 
    "core-js": "^2.4.1", 
    "ngx-bootstrap": "^1.7.1", 
    "rxjs": "^5.1.0", 
    "zone.js": "^0.8.4" 
    }, 

现在我已经钻进app.module.ts，做进口，像它在自述中说：

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule, Http } from '@angular/http'; 
import { TranslateModule, TranslateLoader } from '@ngx-translate/core'; 
import { TranslateHttpLoader } from '@ngx-translate/http-loader'; 
import { LocalizationLoader } from './modules/localization-loader/localization-loader'; 

import { serviceConfigFactory, AppConfig } from './app.config'; 
import { AppRoutingModule } from './app-routing.module'; 
import { AppComponent } from './app.component'; 
import { HomeComponent } from './components/home/home.component'; 
import { AboutComponent } from "./components/about/about.component"; 
import { LoginComponent } from './components/account/login/login.component'; 
import { AuthModule } from './modules/auth/auth.module'; 
import { ArV2Service } from './services/arv2.service'; 
import { CompanyModule } from './modules/company/company.module'; 
import { CompanyComponent } from './components/account/company/company.component'; 
import { SiteService } from './services/site.service'; 
import { AuthHttp } from 'angular2-jwt'; 
import { DatepickerModule } from 'ngx-date-picker'; 

然后

@NgModule({ 
    declarations: [ 
     AppComponent, 
     HomeComponent, 
     AboutComponent, 
     LoginComponent, 
     CompanyComponent 
    ], 
    imports: [ 
     BrowserModule, 
     FormsModule, 
     HttpModule, 
     DatepickerModule, 
     AppRoutingModule, 
     AuthModule, 
     CompanyModule, 
     TranslateModule.forRoot({...}) 
     ... 

不幸的是，Visual Studio告诉我它找不到模块'ngx-date-picker'。

也找不到 './ngx-date-picker'或'NGX-日期选择器/ NGX-日期选择器'或“NGX-日期选择器/ NGX最新-picker.js'或任何其他组合。

不知道接下来要尝试什么。

Answer 1

在网站上详细的安装给定，但是请检查下面的步骤给出：

1.step: yarn add ngx-date-picker --save-dev 

然后检查安装的引导，因为该模块需要引导3或4

<!-- index.html --> 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> 

或

<!--- index.html --> 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"> 

如果使用引导程序4和普通CSS，请检查样式文件为

"styles": [ 
    "../node_modules/bootstrap/dist/css/bootstrap.min.css", 
    "styles.css" 
    ], 

我认为这将是足够的导入

import {DatepickerModule} from 'ngx-date-picker';