web-dev-qa-db-ja.com

「モーメント」にはエクスポートされたメンバー「デフォルト」がありません

アプリケーションのローカル日付形式を変更するためにmoment.jsを使用していますが、次のエラーが発生します。

ライブラリのインポート時に、「モーメント」にはエクスポートされたメンバー「デフォルト」がありません。

以下は私のコードです：

import {Inject, Injectable, Optional} from '@angular/core';
import {DateAdapter, MAT_DATE_LOCALE, MatDateFormats} from '@angular/material';
import * as _moment from 'moment';
import {default as _rollupMoment, Moment} from 'moment';

const moment = _rollupMoment || _moment;
angulartypescriptmomentjsangular7angular-moment
17
Amit Golhar

「compilerOptions」の下の"allowSyntheticDefaultImports": trueにtsconfig.jsonを追加してみてください

35
dileepkumar jami

モーメントのインポートに問題があるようです

ご覧のとおり ドキュメント内 、TypeScript 2.xの場合、compilerOptionsに"moduleResolution": "node"を追加してみてくださいtsconfig.jsonファイルを作成し、以下の構文のいずれかを使用します。

import * as moment from 'moment';
import moment = require('moment');

PS：moment.jsとnpmをインストールしたことを確認してください：

npm install --save moment
2
veben

in gulpfile.js inexternals sectionadd 'moment/moment'および'moment' どちらも

externals: [
      'moment/moment',
       'moment'
   ]
0
Shashank Singh

ここでは、この問題の完全なソリューションを使用します。

最初：

 npm install moment --save
 npm install @angular/material-moment-adapter

第二：

依存関係の下のpackage.jsonで、次のコードがあることを確認してください：

    "@angular/material-moment-adapter": "^8.2.3",

第三：

compileroptionsの下のtsconfig.jsonファイルに、以下を追加します。

"allowSyntheticDefaultImports": true

前方へ：

次のコードでコンポーネントを変更します。

import { MomentDateAdapter } from '@angular/material-moment-adapter';
import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
import * as _moment from 'moment';
import { default as _rollupMoment } from 'moment';

const moment = _rollupMoment || _moment;
export const MY_FORMATS = {
parse: {
  dateInput: 'LL',
},
display: {
  dateInput: 'YYYY-MM-DD',
  monthYearLabel: 'YYYY',
  dateA11yLabel: 'LL',
  monthYearA11yLabel: 'YYYY',
 },
};

@Component({
 selector: 'app-newsfeedform',
 templateUrl: './newsfeedform.component.html',
 styleUrls: ['./newsfeedform.component.css'],
 providers: [
  { provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },

  { provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
],
})

5番目：

次のコードのようなcomponent.htmlファイルのdatepickerで：

     <mat-form-field appearance="outline" fxFlex>
                    <input matInput [matDatepicker]="publishdate" placeholder="Publish Date"
                        formControlName="publishdate">
                    <mat-datepicker-toggle matSuffix [for]="publishdate"></mat-datepicker-toggle>
                    <mat-datepicker #publishdate></mat-datepicker>
                </mat-form-field>

つまり、Angular material datepickerは、上記のフォーマットを変更するだけの任意のフォーマットをカスタマイズできます。

0
MJVM