将过滤器注入单元测试Angular Typescript

Question

I am having trouble injecting the Angular built-in orderByFilter. Any suggestion would be helpful. Thanks in advance! I am getting this error:

TypeError: undefined is not a constructor (evaluating 'this.orderBy(this.registrationList, this.registrationSort, this.sortReverse)

Here is my component:

import { RegistrationModel } from "../models/RegistrationModel";
import { IRegistration } from "../../../services/interfaces/IRegistration";

export class RegistrationsComponent implements ng.IComponentOptions {
    public static componentName = "registrations";
    public template: string = require("./Registrations");
    public controller = RegistrationsController;
}

export class RegistrationsController {
    static $inject = ["RegistrationModel", "orderByFilter"];
    public registrationsList: IRegistration[] = [];
    public registrationSort: string;
    public sortReverse: boolean = false;

    constructor(
        public RegistrationModel: RegistrationModel,
        public orderBy
    ) {}

    public sortRegistrations() {
        this.registrationsList = this.orderBy(this.registrationsList, this.registrationSort, this.sortReverse);
    }
}

Here is my unit test:

import "angular-mocks";
import { RegistrationsComponent, RegistrationsController } from "./RegistrationsComponent";
import { IRegistration } from "../../../services/interfaces/IRegistration";

describe("Registrations", () => {
    var registrationModelMock = {};
    var orderBy;

    beforeEach(angular.mock.module("onboardingTestApp", ($provide: any) => {
        $provide.service("RegistrationModel", () => registrationModelMock);
        $provide.service("orderByFilter", () => orderBy);
    }));

    var registrationList = [
        {
            Created: "2016-05-13",
            Email: "test1@test.com",
        },
        {
            Created: "2017-03-13",
            Email: "test2@test.com",
        },
    ]

    var registrationController = new RegistrationsController(<any>registrationModelMock, orderBy);

    it("should sort the registrations", () => {
        registrationController.registrationsList = <any>registrationList;
        registrationController.registrationSort = "Email";
        registrationController.sortReverse = true;

        registrationController.sortRegistrations();

        expect(registrationList[0].Email).toBe("test2@test.com");
    });
});

Answer 1

There is no 'orderBy' pipe in angular 2. They do have other pipes like currency, uppercase, but they removed orderBy. They removed because of the performance issue from previous angular version.

Here is the the documentation that states that. https://angular.io/docs/ts/latest/guide/pipes.html Read the appendix part that explains lot more about this.