Error 'angular is not defined' while upgrading AngularJS1 component - angularjs

Question

I'm trying to do upgrade components written in AngularJS1 to Angular6. I'm taking the approach of having the wrappers for all the existing AngularJS1 component by extending "UpgradeComponent" placed under the folder "directive-wrappers" in my example. I have written this application in my local and it works fine for 2 components TestDirectiveWrapper and TestDirective2Wrapper.
But when I include the third component TestDirective3Wrapper, while loading the application I get the console error as
angular.min.js:127 Error: [$injector:unpr] http://errors.angularjs.org/1.7.5/$injector/unpr?p0=testDirective3DirectiveProvider%20%3C-%20testDirective3Directive
at angular.min.js:7
at angular.min.js:46
at Object.d [as get] (angular.min.js:43)
at angular.min.js:46
at Object.d [as get] (angular.min.js:43)
at Function.push../node_modules/#angular/upgrade/fesm5/static.js.UpgradeHelper.getDirective (static.js:872)
at new UpgradeHelper (static.js:869)
at TestDirective3Wrapper.UpgradeComponent (static.js:1170)
at new TestDirective3Wrapper (TestDirective3Wrapper.ts:9)
at createClass (core.js:9296) "<app-root _nghost-c0="">"
To mimic the same application online I have created the same angularjs directives and its wrappers in stackblitz, but here I'm getting a different error though.
Can anyone help me in resolving this issue and enable me to load all the 3 components?

Answer 1

I had a play with this, and I managed to get it to work.
There were a few things missing.
You didn't actually include the AngularJS 1.x file.
You didn't import the original AngularJS app module file, or any of the directives.
Once I did those two things, it worked for me.
Here is the relevant code:
In app.module.ts:
import '../AngularJsApp/app.module'; // added
declare var angular: any; // added
angular
.module('testApp')
.directive('appRoot', downgradeComponent({ component: AppComponent }));
In AngularJsApp/app.module.js:
'use strict';
const angular = require('angular'); // added
// Define the `testApp` module
angular.module('testApp', []);
// added these 3 lines
require('./test-directive/test-directive.js');
require('./test-directive2/test-directive2.js');
require('./test-directive3/test-directive3.js');