Question

我无法将数据存储到UserDetailsArr对象，PFB代码供您参考。

用户详细信息类：

    export class UserDetails
    {
        userId:string;
        userName:string;
        password:string;
        firstName:string;
        lastName:string;
        mobileNumber:string;
        email:string
    }

服务类：

    import {Component} from '@angular/core'
    import {OnInit} from '@angular/core'
    import {UserService} from './user.service'
    import {User} from './user'
    import {UserDetails} from './user'
    import {UserDetailComponent} from './user-detail.component'
    import {HTTP_PROVIDERS} from '@angular/http';

    @Component(
        {
            selector:'user-list',
            template: `
                <br/><br/><br/>
                <div>
                <table border='1'> 
                <thead>
                    <tr>
                        <th>First Name </th>
                        <th>Last Name </th>
                        <th>Mobile Number </th>
                        <th>Email </th>
                    </tr>
                </thead>
                      <tr *ngFor="let user of UserDetailsArr">
                        <td> <span (click)="showDetails(user)"> {{user.firstName}} </span> </td>
                        <td> {{user.lastName}} </td>
                        <td> {{user.mobileNumber }} </td>
                        <td> {{user.email}} </td>
                    </tr>                      
                </table>
                </div>
                <user-detail *ngIf = "selectedUser != null" [user] = "selectedUser"></user-detail>
                <br/><br/><br/>

            `, 
            providers:[UserService , HTTP_PROVIDERS],
            directives:[UserDetailComponent] 
        }
    )   
    export class UserListComponent implements OnInit
    {
        users:User[];
        UserDetailsArr: UserDetails[]= [];
        errorMessage: string = '';
        isLoading: boolean = true;
        public selectedUser = null;
        constructor(private _userService:UserService)
        {

        }

        ngOnInit():any
        {
            this.getUsers();
        }

        getUsers()
        {

             this._userService.getUsers()
                   .subscribe(
                        /* happy path */ p => this.UserDetailsArr = p,
                         /* error path */ e => this.errorMessage = e,
                         /* onComplete */ () => this.isLoading = false);                  


           console.log(this.UserDetailsArr);
        }

        showDetails(user)
        {
            this.selectedUser = user;
        }



    }

网络服务完全正常工作如果我按以下方式登录，

   this._userService.getUsers()
           .subscribe(
                /* happy path */ p => console.log(JSON.stringify(p),
                 /* error path */ e => this.errorMessage = e,
                 /* onComplete */ () => this.isLoading = false));

用户数据已登录浏览器控制台。

    [{"UserId":"bcb444aa-401b-48a7-b1bf-17b4bf78b834","UserName":"prabhu","Password":"pwd","FirstName":"PRABHU","LastName":"ARUMUGAM","MobileNumber":"1234567890","Email":"prabhu@gmail.com"},
    {"UserId":"d9e5ba40-d0d7-4d90-89b0-7e26660cc84b","UserName":"senthil","Password":"pwd","FirstName":"SENTHIL","LastName":"KUMAR","MobileNumber":"1234567890","Email":"senthil@gmail.com"},
    {"UserId":"a59dabad-5a8c-4ced-9006-2181bf8c10cb","UserName":"vijay","Password":"pwd","FirstName":"VIJAY","LastName":"RAJ","MobileNumber":"1234567890","Email":"vijay@gmail.com"},
    {"UserId":"f3e2d351-9413-4d80-8623-36556d27f875","UserName":"thamizh","Password":"pwd","FirstName":"THAMIZH","LastName":"VANAN","MobileNumber":"1234567890","Email":"thamizh@gmail.com"}] 
    (e) { return _this.errorMessage = e; } () { return _this.isLoading = false; }

但是，如果我将数据分配给UserDetailsArr，则不会分配数据，

     this._userService.getUsers()
           .subscribe(
                /* happy path */ p => this.UserDetailsArr = p,
                 /* error path */ e => this.errorMessage = e,
                 /* onComplete */ () => this.isLoading = false);  
   console.log(this.UserDetailsArr);

下一行我试图打印但它不起作用，结果未定义。

Answer 1

当数据到达时，Observables会调用传递给select [Key], [Value], (SELECT [Q] FROM [TB2] T2 WHERE [MaxValue] IN (SELECT MIN(MaxValue) FROM [Table1] T2 WHERE T1.[Value]<= T2.[MaxValue])) AS Q, (SELECT MIN(MaxValue) FROM [TB2] T2 WHERE T1.[Value]<= T2.[MaxValue]) AS MaxValue FROM [Table2] T1或其他运算符（如subscribe(...)）的回调。

之后立即调用map(...)之后的代码，并且@JbNizet提到这通常是在数据到达之前的很长时间。

您需要将依赖于从observable接收的数据的代码移动到其中一个回调中：

subscribe(...)

Angular2服务订阅不起作用

1 个答案: