How do I display AngularJS in Angular 2+

Question

I would just like to know how to display AngularJS in Angular 2+ (I have a very unique situation that requires this)

So far this is what I have tried:

https://stackblitz.com/edit/angular-wbbzbz?file=src/app/app.component.ts

To give you an idea of what is happening on stackblitz:

I have a basic html string (which I got from here: https://www.w3schools.com/angular/tryit.asp?filename=try_ng_default):

  myHtml = `
    <!DOCTYPE html>
    <html>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <body>

    <div ng-app="">

    <p>Input something in the input box:</p>
    <p>Name : <input type="text" ng-model="name" placeholder="Enter name here"></p>
    <h1>Hello {{name}}</h1>

    </div>

    </body>
    </html>
  `;

And through a pipe, I display it using:

<div [innerHTML]="myHtml | pipeSanitizeHtml"></div>

But I end up having this (broken AngularJS):

No I have not, could you give me an example of this as I cannot get it working myself — Paul Kruger, Jul 09 '19 at 11:21
You need to host your angular js app as seperate and inside your component use iframe — BLACKMAMBA, Jul 09 '19 at 11:55
Possible duplicate of [Running Angular and AngularJS frameworks side by side](https://stackoverflow.com/questions/43523907/running-angular-and-angularjs-frameworks-side-by-side/43525763#43525763) — georgeawg, Jul 09 '19 at 12:17

score 1 · Answer 1 · answered Jul 09 '19 at 12:53

1

AngularJS will work if you put this in your Angular 2+ index.html's header:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

answered Jul 09 '19 at 12:53

Paul Kruger

2,094
7
22
49

How do I display AngularJS in Angular 2+

1 Answers1