教务前端总结

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/yanwenwennihao/article/details/84502701

学习越久,发现前端和后端越像,和大家分享改一下前端使用switch...case的代码,

 searchInfo(queryType: string, search: any) {
    switch (queryType) {
      case 'course':
        //根据用户课程名称模糊查询课程
        console.log("查询课程", search);
      
        break;
      case 'teacher':
        //根据教师姓名模糊查询教师
        console.log("查询教师");
        
        break;
      case 'class':
        //根据班级名称模糊查询班级      
        let arrangeClassList: any[];
        arrangeClassList = JSON.parse(localStorage.getItem('arrangeClassList'));
        console.log("查询班级", arrangeClassList);
        
        break;
    }
  }

Angular 中 => 的用法:

下面两个例子是等价的:
1 data=>data = data+1
2 function(data){
data = data+1
}

Angular 中 @param的用法

/**
   * 
   * @param admOrPro 学院名称和班级名称模糊查询
   */
  getAllClass(admOrPro?: string) {
    const url = 'teach-web/courseSchedule/queryClassByAcmOrPfs?strLike=' + admOrPro;
    this.http.get(url).subscribe(
      res => {
        if (res.json().code === ResponseCode.SUCCESSCODE) {
          this.classList = res.json().data;
          localStorage.setItem('arrangeClassList', JSON.stringify(this.classList));
        } else {
          this.tipMsgService.createMessage('warning', '查询班级列表为空');
          this.classList = [];
        }
      }
    )
  }

Angular 中setItem和getItem的用法

  localStorage.setItem('arrangeCourseList', JSON.stringify(this.courseList));

  arrangeCourseList = JSON.parse(localStorage.getItem('arrangeCourseList'));

给表格某个字段排序

ts:


  /**
* 单行排序,以学号和入职时间为例
* @param {{key: string; value: string}} sort 排序方法
* @author chris
* @since 2018-10-21 11:07:34
*/
  sort(sort: { key: string, value: string }): void {
    console.log(sort);
    this.sortName = sort.key;
    this.sortValue = sort.value;
    this.search();
  }

  /**
   * 根据选定的需排序的字段进行排序
   * @author chris
   * @since 2018-10-21 11:08:20
   */
  search(): void {
    const data = this.dataSet.filter(item => item.userCode !== this.searchFilter);
    if (this.sortName && this.sortValue) {
      this.dataSet = data.sort((a, b) => (this.sortValue === 'ascend') ? (a[this.sortName] > b[this.sortName] ? 1 : -1) : (b[this.sortName] > a[this.sortName] ? 1 : -1));
      console.log(this.dataSet);
    } else {
      this.dataSet = data;
    }
  }

html:

<thead (nzSortChange)="sort($event)" nzSingleSort>
    <tr>
      <th [ngStyle]="table_tr_E" nzWidth="1%" nzLeft="0px" nzShowCheckbox [(nzChecked)]="allChecked" [nzIndeterminate]="indeterminate"
        (nzCheckedChange)="checkAll($event)"></th>
      <th [ngStyle]="table_tr_E" nzWidth="8%" nzLeft="65px" nzShowSort nzSortKey="code">上课班代码</th>
      <th [ngStyle]="table_tr_E" nzWidth="8%" nzShowSort nzSortKey="name">上课班名称</th>
      <th [ngStyle]="table_tr_E" nzWidth="8%">学年学期</th>
      <th [ngStyle]="table_tr_E" nzWidth="8%">上课班容量</th>
      <th [ngStyle]="table_tr_E" nzWidth="11%">更新日期</th>
      <th [ngStyle]="table_tr_E" nzWidth="5%" nzRight="0px">操作</th>
    </tr>
  </thead>
  <tbody>

 

定时器,setTimeout和setInterval的区别

//setTimeout只在指定时间后执行一次,代码如下:

<script>
//定时器 异步运行
function hello(){
alert("hello");
}
//使用方法名字执行方法
var t1 = window.setTimeout(hello,1000);
var t2 = window.setTimeout("hello()",3000);//使用字符串执行方法
window.clearTimeout(t1);//去掉定时器
</script> 

//setInterval以指定时间为周期循环执行,代码如下:

//实时刷新时间单位为毫秒
setInterval('refreshQuery()',8000); 
/* 刷新查询 */
function refreshQuery(){
   $("#mainTable").datagrid('reload',null);
}



两种方法根据不同的场景和业务需求择而取之,
一般情况下setTimeout用于延迟执行某方法或功能,
setInterval则一般用于刷新表单,对于一些表单的假实时指定时间刷新同步

下面这个方法的意思是传递三个参数,但是有带"?"的参数可传可不传

getAllCourse(courseType_1: string, courseType_2: string, academy?: string){ }

猜你喜欢

转载自blog.csdn.net/yanwenwennihao/article/details/84502701