如何在角度切换2(材质-工具栏)中调用方法?

时间:2019-02-01 05:19:05

标签: angular typescript angular-material

HTML FILE

                            <div class=" -toolbar ">
                                <p>
                                    <mat-toolbar>
                                        <h4>Offer Mapping</h4>
                                        <div class="row align-right col-md-offset-7 col-md-1 ">
                                            <mat-form-field class="button-spacing">
                                                <mat-select placeholder="select">

                                                </mat-select>
                                            </mat-form-field>
                                            <button mat-raised-button (click)="campaignPrioritise()"  [disabled] class="button-spacing">
                                                Prioritise
                                            </button>
                                            
                                           <button mat-icon-button color="primary" (click)="createNewCampaign()">
                                                <mat-icon aria-label="Example icon-button with a heart icon">add_circle_outline</mat-icon>
                                            </button>
                                            <mat-slide-toggle *ngIf= "let element" class="material-icons color_green" matTooltip="Prioritise"
                                            [checked]="element.priority" (change)="campaignPrioritise(element)"></mat-slide-toggle>
                                        </div>
                                    </mat-toolbar>
                                </p>
                            </div>

TS文件

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



/**
 * @title Basic use of `<table mat-table>`
 */
@Component({
  selector: 'table-basic-example',
  styleUrls: ['table-basic-example.css'],
  templateUrl: 'table-basic-example.html',
})
export class TableBasicExample {
  timeSelection1 = '';
  timeSelection2 = '';

  selected: any[] = [];
  selected1 : any[] = [];



on(element){
  let priority = false;
        element.priority = !element.priority;
}

}

当我滑动切换开关时,优先级变量变为true和false 如何实现此功能是Mat工具栏,我试图编写一些代码,但是滑动切换未显示在Mat工具栏上!
当我按下拨动开关时,优先级开关为true,而向左滑动拨动开关为false。 这是我的StackBlitz链接-https://stackblitz.com/edit/toggle12345677709-gfj1?file=main.ts

1 个答案:

答案 0 :(得分:1)

上面的代码中没有声明element。如果您拥有element,则它可以正常工作

element:any = {
   priority: false
 }

on(){
  let priority = false;
  this.element.priority = !this.element.priority;
}