无法弄清楚$ http调用的异步性质

时间:2015-11-17 19:30:04

标签: angularjs typescript angularjs-ng-repeat

我的控制器/服务从网址中检索数据,并返回没有错误。但是,重复< tbody>没有显示数据。检查员显示没有错误,并且fiddler显示为其余的api调用url。

模型

    export interface IAuthor {
    AuthorId: number;
    FirstName: string;
    LastName: string;
    GoogleAuthorId: string;
    CreatedByEmployeeId: any;
    CreatedOn: Date;
    ModifiedByEmployeeId: any;
    ModifiedOn: Date;
    PhotoURI: string;
}

服务

    export class AuthorService implements IAuthorService {
    private url: string;
    static $inject = ["$http"];

    constructor(private $http: ng.IHttpService) {
        this.url = "/odata/Author";
    }

    getAuthors(): ng.IPromise<IAuthor[]> {
        return this.$http
            .get(this.url)
            .then((response: ng.IHttpPromiseCallbackArg<IAuthor[]>): IAuthor[] => {
                return response.data;
            });
    }
}

控制器

    export class AuthorController implements IAuthorController {
    authorItems: IAuthor[];
    static $inject: string[] = ["AuthorService"];

    constructor(private authorService: Services.IAuthorService) {
        var results = this.getAuthors();

    }

    getAuthors(): IAuthor[] {
        this.authorItems = [];
        var results = this.authorService.getAuthors()
            .then((authorItemsLocal: IAuthor[]): void => {
                this.authorItems = authorItemsLocal;

            });

        return this.authorItems;
    }
}

HTML

    <div class="container" ng-controller="AuthorController as vm">

    <h2>Authors</h2>

    <div>
        <table class="table table-striped table-hover table-bordered">
            <thead>
                <tr>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Author ID</th>
                </tr>
            </thead>
            <tbody ng-repeat="c in vm.authorItems">
                <tr>
                    <td>{{ c.FirstName }}</td>
                    <td>{{ c.LastName }}</td>
                    <td>{{ c.AuthorId }}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

我已将结果输入到打字稿中的正确类型。当我将它们输入“任意”时,它起作用了。