angularjs-to-angular4 icon indicating copy to clipboard operation
angularjs-to-angular4 copied to clipboard

Fixed some minor bugs in HybridHelper

Open bertyhell opened this issue 7 years ago • 1 comments

  • Fix semicolons in interface
  • Import angular
  • Unify name: componentSelector in the method: downgradeComponent in class and interface
  • Minor layout improvements

bertyhell avatar Sep 12 '17 09:09 bertyhell

I'm to lazy to make a pull request, but there are a few bugs in here

First of all, the import of angular is missing Second an = is missng And third it says: downQradeProvider instead of downgradeProvider.

Here is the full code on which my editor and webpack no longer fails.

import { downgradeComponent, downgradeInjectable } from '@angular/upgrade/static';
import { FactoryProvider } from '@angular/core';
import * as angular from 'angular';

export interface IComponentUpgradeOptions {
	inputs?: string[],
	outputs?: string[]
}

export interface IHybridHelper {
	downgradeComponent(moduleName: string, componentSelector: string, componentClass: any, options?: IComponentUpgradeOptions): IHybridHelper,
	downgradeProvider(moduleName: string, providerName: string, providerClass: any): IHybridHelper,
	buildProviderForUpgrade(ng1Name: string, ng2Name?: string): FactoryProvider
}

export const HybridHelper: IHybridHelper = {

	downgradeComponent: (moduleName: string, componentName: string, componentClass: any, options?: IComponentUpgradeOptions): IHybridHelper => {
		options = options || {};
		const inputs = options.inputs || [];
		const outputs = options.outputs || [];
		const component = componentClass;

		angular.module(moduleName).directive(componentName, downgradeComponent({
			component, inputs, outputs
		}) as angular.IDirectiveFactory);

		return HybridHelper;
	},

	downgradeProvider: (moduleName: string, providerName: string, providerClass: any): IHybridHelper => {
		angular.module(moduleName).factory(providerName, downgradeInjectable(providerClass));

		return HybridHelper;
	},

	buildProviderForUpgrade: (ng1Name: string, ng2Name?: string): FactoryProvider => {
		ng2Name = ng2Name || ng1Name;

		return {
			provide: ng2Name,
			useFactory: buildFactoryForUpgradeProvider(ng1Name),
			deps: ['$injector']
		};
	}
};

function buildFactoryForUpgradeProvider(ng1Name: string): Function {
	return (injector: any) => injector.get(ng1Name);
}

SamanthaAdrichem avatar May 03 '18 08:05 SamanthaAdrichem