开发者问题收集

如何摆脱 angular 8 中未定义的值?

2020-01-13
291

Component.ts(在此 Valueofcertificate 中,我得到了未定义的值..您能帮我找出解决方案吗??我的第一个条件按预期工作,但第二个和第三个条件不起作用,因为值 id 未定义..我的代码有什么问题吗??)

     this.agentShowSpinner = true;
    // this.agentSuccessSubscription.unsubscribe()
    // this.agentErrorSubscription.unsubscribe()
    this.store.dispatch(new GetAllAgents(`${this.userService.getUserdetails().CompanyUser.company_id.id}/true`))
    this.agentSuccessSubscription = this.store.pipe(select(getAllAgentsSuccess)).subscribe((result : any) => {
      if(!!result) {
        this.getAgents = result
        this.getAgents.map(item => item.valueofCertificate = '')
        this.getAgents.forEach(element =>{

          if(element.foodsafetycertificate.length == 0){
              element.valueofCertificate = "Certificates Not Available"
          }
          else{
            let now = new Date
            now.setHours(0,0,0,0);
               element.foodsafetycertificate.forEach(item => {
                      // if(!item.expiry_date){
                      //     element.valueofCertificate = "Certificates Not Available"
                      //   }
                        if(item.expiry_date  >= new Date(now.setDate(now.getDate()))){
                          element.valueofCertificate = "Certificates are Valid"
                            }
                        else if(item.expiry_date <= new Date(now.setDate(now.getDate()))){
                          element.valueofCertificate = "Certificates Expired"
                            }
                         })
                }


        })
        console.log(this.getAgents)
        this.dataSource = new MatTableDataSource(result)
        this.dataSource.paginator = this.paginator;
      }  else {
        this.dataSource = new MatTableDataSource([])
        this.dataSource.paginator = this.paginator;
      }
2个回答

这个解决方案对我来说非常有效..

this.store.dispatch(new GetAllAgents(`${this.userService.getUserdetails().CompanyUser.company_id.id}/true`))
   this.agentSuccessSubscription = this.store.pipe(select(getAllAgentsSuccess)).subscribe((result : any) => {
     if(!!result) {
       this.getAgents = result
       this.getAgents.map(element =>{
               if(element.foodsafetycertificate.length == 0){
                         element['certificateStatus'] = "Not_Available"
                   } else{
                     let certificateStatus = "Valid";
                     element.foodsafetycertificate.map(item =>{
                           let expirydate = new Date(item.expiry_date).getTime()
                           let now = new Date().getTime()
                          if(expirydate < now) {
                           certificateStatus = "Invalid"
                           }
                      })
                      element['certificateStatus'] = certificateStatus
                }
        })

       this.dataSource = new MatTableDataSource(result)
       this.dataSource.paginator = this.paginator;
     }  else {
       this.dataSource = new MatTableDataSource([])
       this.dataSource.paginator = this.paginator;
     }
     this.agentShowSpinner = false
   })
   this.agentErrorSubscription =  this.store.pipe(select(getAllAgentsError)).subscribe((result : any) => {
     if(!!result) {
       alert(result)
       this.agentShowSpinner = false
       }
     })
   }

   getRowColor(item){
   if (item === "Not_Available") {
     return "red"
   } else if(item === "Valid"){
     return "#00FF00"
   }
   else if(item === "Invalid"){
     return "#DAA520"
      }
    }
Rekha
2020-01-17
getFoodCertificateValues(element: any){
    let now = new Date
    now.setHours(0,0,0,0);
    element.foodsafetycertificate.forEach(item => {
      if(!item.expiry_date){
        element.valueofCertificate = "Certificates Not Available"
      }
      else if(item.expiry_date  >= new Date(now.setDate(now.getDate()))){
        element.valueofCertificate = "Certificates are Valid"
          }
       else if(item.expiry_date <= new Date(now.setDate(now.getDate()))){
        element.valueofCertificate = "Certificates Expired"
          }
    })
}

对于上面的代码,当然它肯定会抱怨未定义,因为您没有声明 item 属性。即使您声明了 item 属性,它仍然会抱怨 item 未定义,因为您没有使用任何订阅,因此 item 属性可以订阅并包含该订阅的值。此外,正如我所观察到的,我看到您正在使用 getFoodCertificateValues 并使用 element prorpety ,我假设您正在尝试获取特定元素的值。为了防止这种情况,它应该是类似于此的东西

item: any; // declare item property
getFoodCertificateValues(element: any){
       this.yourService.yourServiceName(element)
            .subscribe(data => {
                this.item = data;
                ... // put entire of your if condition in here
             });
}

让我解释一下:

  1. 对于上面的代码,element 属性是用户在模板上单击/更改或执行任何他/她想要的操作的地方。element 属性将接收该更改的数据。然后将该数据传递给 yourServiceName。在那里,您的服务将执行 GET 请求并将该值从元素属性传递到 URL,URL 然后传递到 API,然后 API 执行您设置的任何 API 操作来为您获取数据。然后,当数据准备就绪并返回时, .subscribe() 中的数据属性将包含 API 处理后的数据。 this.item = data 表示 item 属性将包含 data 属性的所有值
  2. 如果将 item 属性放在 .subscribe() 之外, item 属性将变为未定义,即使它在 getFoodCertificateValues() 方法中使用。因此,如果您想使用 item 属性,请在我注释掉的 .subscribe() 内使用它。

Base on information you provided, that is all I can answer. I hope this help. Corrections are all welcome

Venusssss
2020-01-13