Angular 返回值无法读取属性'；价值'；未定义的

我对angular非常陌生，所以我不知道这个问题是否得到了回答。我研究了一些答案，但没有弄清楚。如果此问题已得到答复，则表示抱歉

我有一个Angular服务，它调用后端RESTAPI

导出类学生服务{
private studentUrl:string；
构造函数（私有httpClient:httpClient）{
this.studentUrl='someurl'；
}
public getTag（email:string）：可观察{
const params=new HttpParams（）.set（“email”，email）；
返回this.httpClient.get（this.studentUrl.concat（“标记”）{
params
});
}
getCoursesForStudent（标记：字符串）：可观察{
const params=new HttpParams（）.set（“tag”，tag）；
返回this.httpClient.get（this.studentUrl.concat（'courses'）{
params
})
}
getStudentByEmail（email:string）：可观察{
const params=new-HttpParams（）.set（“email”，email.toString（））；
返回this.httpClient.get（this.studentUrl.concat（'getstu'）{
params
})
}
}

我还有一个组件可以使用它

导出类StudentprofileComponent实现OnInit{
课程：可观察；
学生：学生；
纽斯图：学生；
标签：有效载荷；
有效载荷=有效载荷；
构造函数（私有studentservice:studentservice，私有路由器：路由器）{}
课程（{
有效载荷：新的有效载荷（）；
const email=atob（localStorage.getItem（'stuemail'）；
this.studentservice.getTag（电子邮件）.subscribe（数据=>{
this.tag=数据，
console.log（“数据：”+data.value）
});
返回this.studentservice.getCoursesForStudent（this.tag.value）；
}
学生（{
让email=atob（localStorage.getItem（'email'））；
返回此.studentservice.getStudentByEmail（email.toString（））；
}
恩戈尼尼特（）{
this.loadStudent（）.subscribe（数据=>{
this.student=数据
}，错误=>
console.log（错误））；
this.courses=this.loadCourses（）；
}
}

问题是，我一直得到类型错误，无法读取未定义的属性“value”。甚至数据也打印在控制台中

---

这是一个异步调用。您不知道服务器何时将返回此get端点的答案-

您可以使用函数.subscribe（）订阅调用。 在您订阅的那一刻，get将尝试到达后端

当get返回时，subscribe函数中的所有内容都将被执行

//1.register subscription
    this.studentservice.getTag(email).subscribe(
data=>{
//3. will be executed when server answers
this.tag = data , 
    console.log("data:"+data.value)});

//2. Will return the value before the tag-object is set in subscribe
    return this.studentservice.getCoursesForStudent(this.tag.value);

因此，当您调用返回所在的行时，标记对象仍然没有定义，因为订阅尚未返回

您可以尝试在订阅中执行getCoursesForStudent，但这会使其更加复杂

当另一个完成时，您可以尝试使用switchmap订阅可观察对象

---

这是一个异步调用。您不知道服务器何时将返回此get端点的答案-

您可以使用函数.subscribe（）订阅调用。 在您订阅的那一刻，get将尝试到达后端

当get返回时，subscribe函数中的所有内容都将被执行

//1.register subscription
    this.studentservice.getTag(email).subscribe(
data=>{
//3. will be executed when server answers
this.tag = data , 
    console.log("data:"+data.value)});

//2. Will return the value before the tag-object is set in subscribe
    return this.studentservice.getCoursesForStudent(this.tag.value);

因此，当您调用返回所在的行时，标记对象仍然没有定义，因为订阅尚未返回

您可以尝试在订阅中执行getCoursesForStudent，但这会使其更加复杂

当另一个完成时，您可以尝试使用switchmap订阅可观察对象

---

嵌套订阅是一种反模式，应该避免。尝试使用switchMap操作符获取所需的值

export class StudentprofileComponent implements OnInit {
    courses: CourseDto ; // Removed the Observable due to new subscription
    student: Student;
    // newstu: Student;
    // tag: PayLoad;
    // payload = PayLoad;

    constructor(private studentservice: StudentService, private router: Router) {}

    // loadCourses() {
    //     payload: new PayLoad();
    //     const email = atob(localStorage.getItem('stuemail'));
    //     this.studentservice.getTag(email).subscribe(data => {
    //         this.tag = data,
    //             console.log("data:" + data.value)
    //     });
    //     return this.studentservice.getCoursesForStudent(this.tag.value);
    // }

    // loadStudent() {
    //     let email = atob(localStorage.getItem('email'));
    //     return this.studentservice.getStudentByEmail(email.toString());
    // }

    ngOnInit() {
        const email = atob(localStorage.getItem('email')).toString();
        const stuEmail = atob(localStorage.getItem('stuemail')).toString();

        this.studentservice.getStudentByEmail(email).subscribe(student => this.student = student);

        this.studentservice.getTag(stuEmail).pipe(
            switchMap(tag => this.studentservice.getCoursesForStudent(tag.value))
        ).subscribe(courses => this.courses = courses);
        
    }

}

---

嵌套订阅是一种反模式，应该避免。尝试使用switchMap操作符获取所需的值

export class StudentprofileComponent implements OnInit {
    courses: CourseDto ; // Removed the Observable due to new subscription
    student: Student;
    // newstu: Student;
    // tag: PayLoad;
    // payload = PayLoad;

    constructor(private studentservice: StudentService, private router: Router) {}

    // loadCourses() {
    //     payload: new PayLoad();
    //     const email = atob(localStorage.getItem('stuemail'));
    //     this.studentservice.getTag(email).subscribe(data => {
    //         this.tag = data,
    //             console.log("data:" + data.value)
    //     });
    //     return this.studentservice.getCoursesForStudent(this.tag.value);
    // }

    // loadStudent() {
    //     let email = atob(localStorage.getItem('email'));
    //     return this.studentservice.getStudentByEmail(email.toString());
    // }

    ngOnInit() {
        const email = atob(localStorage.getItem('email')).toString();
        const stuEmail = atob(localStorage.getItem('stuemail')).toString();

        this.studentservice.getStudentByEmail(email).subscribe(student => this.student = student);

        this.studentservice.getTag(stuEmail).pipe(
            switchMap(tag => this.studentservice.getCoursesForStudent(tag.value))
        ).subscribe(courses => this.courses = courses);
        
    }

}

---

您的服务呼叫没有得到正确的响应。这使得“数据”变量未定义。因此，当您试图从未定义的var获取字段时，您会收到一个错误。响应是从服务调用发出的，您没有得到服务调用的正确响应。这使得“数据”变量未定义。因此，当您试图从未定义的var中获取字段时，会出现一个错误