【问题标题】:Default value for toggle button in angular角度切换按钮的默认值
【发布时间】:2021-03-21 19:58:16
【问题描述】:

我有一个带有多个选项的切换按钮。 我必须先将默认选项设置为 true,并且必须返回此值。 我是这样实现按钮的

        <form novalidate>
          <mat-button-toggle-group name="testSelect" [(ngModel)]="testSelect">
            <mat-button-toggle *ngFor="let item of options" [nxValue]="item.headline">
              
                {{ item.headline }} 
            </mat-button-toggle>
          </mat-button-toggle-group>
          <p>
            Current Value: {{ testSelect }}
          </p>
        </form>

ts

export class CComponent{
testSelect: string;
options = [
{
  
  headline: 'apple'
},
{
 
  headline: 'mango'
},
{
  
  headline: 'orange'
}
]; 
}

关于默认选项,我希望预先选择组的最后一个选项,并且必须记录其值。现在就我而言,只有在选择按钮后才会记录该值。

【问题讨论】:

  • 您面临的问题是什么?
  • 我希望预先选择组的最后一个选项,并且必须记录其值。现在就我而言,仅在选择按钮后才记录该值。 @VimalPatel

标签: angular angular-material toggle togglebutton


【解决方案1】:

您可以使用value 属性进行默认选择。

<mat-button-toggle-group name="testSelect" [(ngModel)]="testSelect" value="textSelect">
    <mat-button-toggle *ngFor="let item of options" [value]="item.headline">
        {{ item.headline }}
    </mat-button-toggle>
</mat-button-toggle-group>

并在您的组件中将值分配给您希望默认选中的textSelect

testSelect: string="orange";

来自这个答案Link的参考。

【讨论】:

猜你喜欢
  • 1970-01-01
  • 2019-08-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-01-16
  • 1970-01-01
  • 2021-10-07
相关资源
最近更新 更多