前言

      開發一個新頁面途中，總結的一些經驗。

頁面效果

      功能1：查詢簽到/未簽到結果

      功能2：模糊查詢

     功能3:修改狀態

經驗總結

【引入primeng】

       具體使用:

       當需要一個控制元件來滿足我的需求頁面的時候，我可以去primeNG裡面找一些差不多的控制元件來改裝成自己想要的效果。

       比如，我的功能1，用到了2個控制元件。

 ① 其中：控制元件1是TabView

           官網效果：

官網講解了如何使用：

②控制元件2,：用的是ListBox,嵌入到了控制元件1中。

            官網效果：

根據官網的文件來編寫自己需要的效果。

【angular程式碼經驗】

   1、引入primeNG或其他需要的服務

        在最近的module裡面引入：

     2、ngSwitch的使用

         其中：isSearch是在ts裡面定義並賦值的。

        3、 雙向繫結：【（ngModel）】

               比如：獲取input搜尋框中的值

              ts中：input:string;   

               其中注意：必須要先引入

               import { FormsModule } from '@angular/forms';

           4、html向後臺傳值（感謝雪芬美女）

           可以直接在click方法裡面吧html裡面能獲取到的值傳入後面就行，在ts中：

          5、http傳值

               get

onChange(myID:string){
  this.myStudentId=myID;
  this.display=true;
  //查詢所有簽到狀態
  let getStudent="sign-web/sign/findSignStatus";
  this.http.get(getStudent).subscribe(
     res => {
          if (res.json().code == "0000" && res.json().data.length != 0) {
            var data=res.json().data;
            this.allState=data;
            console.log(JSON.stringify(this.allState)+"這是所有的狀態");         
        }  
      }
    );
}

            post:

  let getStudent="sign-web/studentSign/updateSignState/"+this.myStudentId+"/"+this.signID+"/"+id;
  this.http.post(getStudent,"").subscribe(
     res => {
          if (res.json().code == "0000") {
            this.msgs=[{
              severity:'success',
              summary:'提示',
              detail:'修改成功！'    
           }] 
            this.display=false;     
        }  
      }
    );

             假資料：

              let getStudent="../../assets/mock-data/mystudent.json";

              直接把真實的url換成假資料的地址（先引入）就可以用了。

         6、解析返回結果json：[]代表資料，{}代表物件。感謝剛鵬大神！

              例如：

               console.log(JSON.stringify(res.json().data.unFinish)+"888");或者

               var data=res.json();

               console.log(data[0].unFinish[0].signStatusId+"666666");

               逐步列印分析。

  小結：

          自己去多試試，試不出來，多多請教大神，收穫多多~