2

テンプレート列にカレンダーを使用して編集可能なグリッドを作成する必要があります。次のコードを使用していますが、実行時にエラーが返されます。以下の強調表示された行でエラーが発生していると思います。

ERROR: Uncaught (in promise): 位置 2 に予期しないリテラルがあります

 <div class="content">
    <div class="form-section">
        <form *ngIf="checklistForm" class="form" [formGroup]="checklistForm" novalidate>
            <p-growl [(value)]="successMessage"></p-growl>
            <div class="alert alert-danger" role="alert" *ngIf="errorMessage">
                <span>{{ errorMessage }}</span>
            </div>
            <userTracking [isChanged]="isChanged">
            </userTracking>
            <p-dataTable [value]="lstchecklistModel" [responsive]="true" rowGroupMode="subheader" groupField="groupdesc" [editable]="true" [style]="{'margin-top':'10px'}">
                <ng-template pTemplate="rowgroupheader" let-rowData>{{rowData['groupdesc']}}</ng-template>
                <p-column field="labelName" header="Checklist" [style]="{'overflow':'visible', 'width':'300px'}"></p-column>
                <p-column field="required" header="Required?" [editable]="true" [style]="{'overflow':'visible', 'width':'100px'}">
                    <ng-template let-col let-row="rowData" let-i="rowIndex" pTemplate="editor">
                        <p-dropdown [(ngModel)]="row[col.field]" (onChange)="OnRequiredChange(row);" [ngModelOptions]="{standalone: true}" [options]="RequiredValues" [autoWidth]="false" [style]="{'width':'100%'}"></p-dropdown>
                    </ng-template>
                </p-column>
                <p-column field="received" header="Recived?" [editable]="true" [style]="{'overflow':'visible', 'width':'100px'}">
                    <ng-template let-col let-row="rowData" pTemplate="editor">
                        <p-dropdown [(ngModel)]="row[col.field]" [ngModelOptions]="{standalone: true}" (onChange)="OnRecievedChange(row);" [options]="RequiredValues" [autoWidth]="false" [style]="{'width':'100%'}"></p-dropdown>
                    </ng-template>
                </p-column>
                <p-column field="receivedDate" header="Received Date">     
                    <ng-template let-col let-row="rowData" pTemplate="body">
                        {{row[col.field] }}
                    </ng-template>              
                </p-column>
                **<p-column field="mailReceivedDate" header="Mail Received Date" [editable]="true" [style]="{'overflow':'visible'}">
                    <ng-template let-col let-row="rowData" pTemplate="body">
                        {{row[col.field] }}
                    </ng-template>
                    <ng-template let-col let-row="rowData" pTemplate="editor">
                        <p-calendar [(ngModel)]="row[col.field]" [ngModelOptions]="{standalone: true}" [locale]="en" ></p-calendar>
                    </ng-template>
                </p-column>**
                <p-column field="updatedBy" header="Updated By"></p-column>
            </p-dataTable>
            <footer class="pager">
                <div class="button-group">
                    <button class="btn btn-primary btn-sm" (click)="saveChecklist();" [disabled]="!checklistForm.valid">Save</button>
                    <button class="btn btn-primary btn-sm" (click)="SaveandContinue();" [disabled]="!checklistForm.valid">Save & Continue</button>
                    <button class="btn btn-secondary btn-sm" type="reset" (click)="loadData();" formnovalidate>Cancel</button>
                </div>
            </footer>
        </form>
    </div>
</div>
4

1 に答える 1

0

p-table 内で p-calendar を使用しようとすると、プロジェクトでまったく同じエラーが発生しました。私の問題は、カレンダーがバインドされている ngModel オブジェクトが http リクエストから来たため、 [(ngModel)]="myDate" のランタイム タイプが文字列だったことです。

この問題をどのように解決したか:

this.myObject = get(); if (myObject.myDate) { myObject.myDate = new Date(myObject.myDate); }

if ステートメントが存在するのは、new Date(null) が null ではなく 1969 年の日付 (具体的には Date.getTime が 0 の場合) を返すためです。

于 2019-07-16T14:01:35.833 に答える