小编sta*_*ght的帖子

我正在使用Angular Material 5.0.0-rc0Angular 5应用程序中的最新版本.我试图datepicker用Angular材料提供一系列日期,但我找不到任何关于它的文档.

我可以使用它是选择一个startDate或设置minDate和maxDate.这是HTML代码

<mat-form-field>
  <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="picker" placeholder="Choose a date">
  <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
  <mat-datepicker #picker startView="year" [startAt]="startDate"></mat-datepicker>
</mat-form-field>

和TS代码

import {Component} from '@angular/core';

@Component({
  selector: 'datepicker-start-view-example',
  templateUrl: 'datepicker-start-view-example.html',
  styleUrls: ['datepicker-start-view-example.css'],
})
export class DatepickerStartViewExample {
  minDate = new Date(2000, 0, 1);
  maxDate = new Date(2020, 0, 1);
}

此代码可帮助我选择最小和最大日期范围内的一个日期,但不允许选择它们的范围.虽然使用第三方库可以解决这个问题,但它会有一个不同的UI,这将与我当前的应用程序的UI不同.请帮我解决这个问题.

我在我的 Angular 4 应用程序中使用路由保护，如果条件满足并返回 true，我想向路由添加一个查询参数。

这是我一直在研究的代码

@Injectable()
export class ViewGuardService implements CanActivate {

  constructor(private router: Router) { }

  canActivate(activatedRoute: ActivatedRouteSnapshot, snapshot: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    if(!this.router.url.includes('/order-management')) {
      //ADD PARAMS TO ROUTE OR PASS DATA TO COMPONENT HERE AND THEN RETURN TRUE
       return true;
    } else {
       this.route.navigate['/login'];
       return false;
    }
  }
}

通常，要导航到带有参数的路线，我们可以将其用作this.router.navigate(['/order-management', activatedRoute.url[0].path], { queryParams: { moveToOrders: true }});. 但如果我在if条件中使用这个条件，就会导致函数调用的无限循环。

那么如何将参数或数据从守卫传递到组件呢？请帮我解决这个问题。

我最近开始学习 Flutter 并且一直在浏览文档。我正在开发这个小应用程序，它的屏幕顶部有一个按钮，下面有一个列表。

每当我将RaisedButton一个ListView小部件传递给另一个ListView或Column小部件时，它都会抛出错误。

I/flutter ( 4734): ??? EXCEPTION CAUGHT BY RENDERING LIBRARY ??????????????????????????????????????????????????????????
I/flutter ( 4734): The following assertion was thrown during performResize():
I/flutter ( 4734): Vertical viewport was given unbounded height.
I/flutter ( 4734): Viewports expand in the scrolling direction to fill their container.
////MORE LINES OF ERRORS/////

这是我一直在研究的代码：

import 'package:flutter/material.dart';

void main() {
  runApp(ListDemo(
    items: new List<ListItem>.generate(
      100,
          (i) => i % 6 == 0
          ? new HeadingItem("Heading $i") …

我正在尝试使用 Angular 4 访问 localStorage 并使用 Observables 查找 localStorage 值的变化：

这是我一直在研究的代码：

userNameObservable: Observable<string>;
userName: String = '';
ngOnInit() {
    this.userNameObservable = Observable.create(
      Observable.of(localStorage.getItem('profileName'))
    );
    this.userNameObservable.subscribe((name: String) => {
      this.userName = name;
    })
}

但我收到一个错误ERROR TypeError: this._subscribe is not a function。我该如何解决？有没有更好更有效的方法来查找 localStorage 中的更改？

我正在尝试select在Angular 4中创建自定义选项。但是li当不确定将焦点放在input元素上时如何选择这些选项时，我大吃一惊。

这是我的html代码：

<div class="input-container">
     <input type="text" id="iLocation"
               (focus)="onLocationFocus()"
               (blur)="onLocationBlur()">
     <span class="underline"></span>
     <label for="iLocation">Preferred Type</label>

     <div class="options-container" tabindex="0" #optionsContainerRef>
        <ul>
           <li *ngFor="let loc of locationOptions">{{loc.option}}</li>
        </ul>
     </div>
</div>

这是我的组件打字稿：

locationOptions = [{icon: 'school', option: 'School'}, {icon: 'home', option: 'Home'}];
@ViewChild("optionsContainerRef") optionsContainerRef: ElementRef;
constructor(private renderer: Renderer2) { }
    onLocationFocus() {
      this.renderer.setAttribute(this.optionsContainerRef.nativeElement.children[0].children[0], 'focus', 'true');
    }
    onLocationBlur() {}

即使渲染器添加了focus="true"元素，该li元素也没有被聚焦。我background-color在聚焦时已经编写了css代码li ，但是元素没有聚焦并且颜色没有改变。

我遇到的另一个问题是如何li使用键盘上和下箭头在元素之间导航。在角度4中执行此操作的有效方法是什么？我已经看到了此参考资料，但不确定如何将它做成角度。

请指导并帮助我解决此问题。

我在Angular 4中制作了一个反应形式，并valueChanges在下面的形式中寻找：

this.searchForm.valueChanges.subscribe((value) => {
   console.log(value);
});

上面的代码工作完美。但如何从取消valueChanges上ngOnDestroy()作为this.searchForm.valueChanges.unsubscribe()似乎并不工作。请帮我解决这个问题。