material-component-datetime-picker-您在预期流的位置提供了“未定义”。您可以提供 Observable、Promise、Array 或 Iterable答案

【问题标题】：material-component-datetime-picker-You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterablematerial-component-datetime-picker-您在预期流的位置提供了“未定义”。您可以提供 Observable、Promise、Array 或 Iterable
【发布时间】：2021-04-03 22:59:32
【问题描述】：

我已尝试根据文档使用材料组件日期时间选择器，以下信息包含有关环境的信息。

角度

角度版本：10.1.0

材料版本：10.1.0

angular-material-components/moment-adapter - 4.0.1

angular-material-components/datetime-picker - 4.0.2

以下是查看日期时间选择器的代码块。

<mat-form-field> <input matInput [ngxMatDatetimePicker]="picker" placeholder="Choose a date" [formControl]="tab._from" [min]="minDate" [max]="maxDate" [disabled]="disabled"> <mat-datepicker-toggle matSuffix [for]="picker"> </mat-datepicker-toggle> <ngx-mat-datetime-picker #picker [showSpinners]="showSpinners" [showSeconds]="showSeconds" [stepHour]="stepHour" [stepMinute]="stepMinute" [stepSecond]="stepSecond" [touchUi]="touchUi" [color]="color"> </ngx-mat-datetime-picker> </mat-form-field>

当我尝试加载页面时，会出现日期时间选择器，但控制台上会出现以下错误。

ERROR TypeError: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable. at subscribeTo (subscribeTo.js:27) at subscribeToResult (subscribeToResult.js:11) at MergeMapSubscriber._innerSub (mergeMap.js:59) at MergeMapSubscriber._tryNext (mergeMap.js:53) at MergeMapSubscriber._next (mergeMap.js:36) at MergeMapSubscriber.next (Subscriber.js:49) at Observable._subscribe (subscribeToArray.js:3) at Observable._trySubscribe (Observable.js:42) at Observable.subscribe (Observable.js:28) at MergeMapOperator.call (mergeMap.js:21)

TS 文件

export class Picker {
   @ViewChild('fromPicker') fromPicker: any;
  @ViewChild('toPicker') toPicker: any;

  public date: moment.Moment;
  public disabled = false;
  public showSpinners = true;
  public showSeconds = false;
  public touchUi = false;
  public enableMeridian = false;
  public minDate: moment.Moment;
  public maxDate: moment.Moment;
  public stepHour = 1;
  public stepMinute = 1;
  public stepSecond = 1;
  public color: ThemePalette = 'primary';

  public stepHours = [1, 2, 3, 4, 5];
  public stepMinutes = [1, 5, 10, 15, 20, 25];
  public stepSeconds = [1, 5, 10, 15, 20, 25];
}

似乎错误与我们使用的选择器有关。

任何原因或缺少任何依赖项？

【问题讨论】：

[ngxMatDatetimePicker] 这不是材料角度
@Eliseo 是的。不推荐使用，如果你访问这个npmjs.com/package/@angular-material-components/datetime-picker，这个包就是我正在使用的，使用它来完成实现
有确切的问题
@CharlieNorris ohh..你找到什么了吗？

标签： angular angular-material datetimepicker

【解决方案1】：

将 @angular-material-components/datetime-picker 更新到版本 4.0.3 对我有用。更新是几小时前发布的 https://www.npmjs.com/package/@angular-material-components/datetime-picker

【讨论】：

奇怪的是它特别适用于@angular/material @10.2.1
即使使用 4.0.3 也无法正常工作。 http://prntscr.com/12gpnwy请帮忙

【解决方案2】：

在 4.0.3 版中也对我有用。更新你的包。

【讨论】：

【解决方案3】：

对于 Angular v11 升级 @angular-material-components/datetime-picker 到 v 5.1.0 修复了这个错误

【讨论】：

好的，谢谢。升级到 v11 后它确实消失了。

【解决方案4】：

首先，您使用的是 ngx-mat-datetime-picker，它是角度材料日期选择器的包装插件： https://www.npmjs.com/package/ngx-mat-datetime-picker

实现看起来不错，但肯定会出现错误，因为您没有通过正确类型的属性传递预期值。某些组件属性未定义，您将其传递给属性。您可以重新访问演示实现并检查您是否发送了正确的值：

https://stackblitz.com/edit/demo-ngx-mat-datetime-picker?file=src%2Fapp%2Fapp.component.html

【讨论】：

双重检查。当我启用部分
你能分享输出图像吗，因为用我的代码替换你的 [formcontrol] 可以使用你的代码：
我已经用输出错误控制台更新了问题。日历出现上述错误
我已经用 TS 文件中的代码部分更新了问题。我已经添加了 datepicker 的必要部分
您添加的代码是正确的，一定是TS文件的其他部分导致问题

【解决方案5】：

我也遇到了同样的问题角 11.1.0 材料 11.1.0 日期时间选择器：5.0.3

我已经设法在一定程度上隔离了问题，它发生在这里：

    _watchStateChanges() {
        const datepickerStateChanged = this.datepicker ? this.datepicker.stateChanges : of();
        const inputStateChanged = this.datepicker && this.datepicker.datepickerInput ?
            this.datepicker.datepickerInput.stateChanges : of();
        const datepickerToggled = this.datepicker ?
            merge(this.datepicker.openedStream, this.datepicker.closedStream) :
            of();
        this._stateChanges.unsubscribe();
        this._stateChanges = merge(this._intl.changes, datepickerStateChanged, inputStateChanged, datepickerToggled).subscribe(() => this._changeDetectorRef.markForCheck());
    }

由于某种原因，此处未定义 datepickerStateChanged。这就是导致问题进一步发生的原因。不知道为什么。如果有人有更多的答案，那就太棒了。现在，我将把它作为一个错误提交。

似乎已经在里面了： https://github.com/h2qutc/angular-material-components/issues/94

他们建议降级到 4.0.3，这是我明天要尝试的。

【讨论】：