小编nsk*_*nsk的帖子

我有一个要求,我应该能够捕获所选行[用户可以点击该行的任何位置].我浏览了文档https://material.angular.io/components/table/overview,但我找不到捕获所选行及其内容的方法.我试图在md-table标签上附加一个click事件, 但它没有用.

<md-table #table [dataSource]="tableDataSource" (click)="selectRow(row)">

在我升级到6之前,代码运行正常.不确定之间发生了什么变化!我也需要导入模块

MatInputModule,
MatSelectModule,
MatFormFieldModule

  <mat-input-container>
    <mat-select placeholder="Sort By" formControlName="sortBy">
      <mat-option *ngFor="let sortByObject of sortByList" [value]="sortByObject.value">
        {{ sortByObject.label }}
      </mat-option>
    </mat-select>
  </mat-input-container>

我检查了https://material.io/tools/icons/ 上可用的图标列表，我看到的最接近的匹配是

用于登录或登录

• vpn_key https://material.io/tools/icons/?search=vpn_key&icon=vpn_key&style=baseline

• 输入 https://material.io/tools/icons/?search=input&icon=input&style=baseline

• exit_to_app https://material.io/tools/icons/?search=exit&icon=exit_to_app&style=baseline

注销或注销

• power_settings_new https://material.io/tools/icons/?search=power&icon=power_settings_new&style=baseline

这些是普遍可以接受的图标吗，或者您能否建议是否还有其他图标

我遵循了https://www.primefaces.org/primeng/#/menubar，它很好地显示了可以作为列表传递的菜单项。我的要求是将与应用程序相关的徽标图像添加到左上角。Plz可以建议如何进行这项工作。

ngOnInit() {
        this.items = [
            {label: 'Chart', icon: 'fa-bar-chart', routerLink: 'charts'},

和我的HTML看起来如下

<p-menubar [model]="items"></p-menubar>

由于只是将项目作为数组传递，我可能知道如何显示app-logo-image。

我有以下两列，我想动态交换/更改按钮的fxFlex值onClick。我知道，如果您调整屏幕大小，fxFlex.md / lg等将启动，我能够完成。但是我试图了解如何在某些事件（如按钮单击）上更改静态屏幕大小上的fxFlex值。

<div flexLayout="row">
  <div fxFlex="fxFlexForCol1" style="background-color: green">
    <button mat-raised-button (click)="swapViewableArea()">Click to enlarge view {{fxFlexForCol1}}</button>
  </div>
  <div fxFlex="fxFlexForCol2" style="background-color: red">
      <button mat-raised-button (click)="swapViewableArea()">Click to enlarge view {{fxFlexForCol2}}</button>
    </div>

  swapViewableArea() {
    const temp = this.fxFlexForCol1;
    this.fxFlexForCol1 = this.fxFlexForCol2;
    this.fxFlexForCol2 = temp;
  }

在单击按钮时，我看到fxFlexForCol1和fxFlexForCol2值已交换，但flexLayout在UI布局中没有反映相同的值

任何建议，请。

在下面的代码中，我的国家/地区选择选项被多次触发以致浏览器停止响应。

<div [formGroup]="countryForm">
  <mat-form-field>
    <mat-select formControlName="selectedCountry" class="my-item-text" placeholder="Country">
      <mat-option (onSelectionChange)="onCountrySelectionChanged($event)" *ngFor="let myCountry of countries" [value]="myCountry.short" class="my-item-text">{{ myCountry.name }}
      </mat-option>
    </mat-select>
  </mat-form-field>
</div>

和我的组件代码如下

  onCountrySelectionChanged(changeEvent) {
    if (changeEvent && changeEvent.isUserInput && this.selectedCountry != changeEvent.source.value) {
      this.countrySelected.emit( changeEvent.source.value);
    }
  }

我试图通过检查它的用户更改事件 [isUserInput] 并检查值是否真的改变来进行限制！现在可以减少火灾事件并且应用程序正常工作。

有没有更好的方法来使用选择选项，因为我现在在使用 mat-select 组件的任何地方都包括上述逻辑。