(SystemJS) AngularJS v1.x is not loaded! (Hybrid NG1 + NG2 w. RC5)

[Kyle Thomas]

I'm currently bootstrapping my hybrid angular 1 and 2 app and I get this error when I try to load it.

localhost/:22 Error: (SystemJS) AngularJS v1.x is not loaded!
    Error: AngularJS v1.x is not loaded!
        at Object.noNg (http://localhost:3000/js/vendor/@angular/upgrade/src/angular_js.js:10:11)
        at UpgradeAdapter.bootstrap (http://localhost:3000/js/vendor/@angular/upgrade/src/upgrade_adapter.js:323:33)
        at Object.eval (http://localhost:3000/js/app/boot.js:6:16)
        at eval (http://localhost:3000/js/app/boot.js:10:4)
        at eval (http://localhost:3000/js/app/boot.js:11:3)
    Evaluating http://localhost:3000/js/app/boot.js
    Error loading http://localhost:3000/js/app/boot.js

Any suggestions would be greatful!

My boot.ts

///<reference path="../../typings/index.d.ts"/>
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { UpgradeAdapter } from '@angular/upgrade';

import { AppModule } from "./app.module";

// platformBrowserDynamic().bootstrapModule(AppModule);

const upgradeAdapter = new UpgradeAdapter(AppModule);
upgradeAdapter.bootstrap(document.body, ['my-app'], {strictDi: true});

My app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent } from "./app.component";
import { MessageService } from "./messages/message.service";
import { MessageComponent } from "./messages/message.component";
import { MessageListComponent } from "./messages/message-list.component";
import { MessagesComponent } from "./messages/messages.component";
import { MessageInputComponent } from "./messages/message-input.component";
import { AuthenticationComponent } from "./auth/authentication.component";
import { LogoutComponent } from "./auth/logout.component";
import { SignupComponent } from "./auth/signup.component";
import { SigninComponent } from "./auth/signin.component";
import { HeaderComponent } from "./header.component";
import { ROUTING } from "./app.routing";
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { HttpModule } from "@angular/http";

@NgModule({
    declarations: [
        AppComponent,
        MessageComponent,
        MessageListComponent,
        MessagesComponent,
        MessageInputComponent,
        AuthenticationComponent,
        LogoutComponent,
        SignupComponent,
        SigninComponent,
        HeaderComponent
    ],
    imports: [BrowserModule, ROUTING, FormsModule, ReactiveFormsModule, HttpModule],
    bootstrap: [AppComponent],
    providers: [MessageService]
})
export class AppModule {

}

My app.component.ts

import { Component } from '@angular/core';
import { Routes, ROUTER_DIRECTIVES } from "@angular/router";

import { MessagesComponent } from "./messages/messages.component";
import { AuthenticationComponent } from "./auth/authentication.component";
import { HeaderComponent } from "./header.component";

@Component({
    selector: 'my-app',
    template: `
        <div class="container">
            <my-header></my-header>
            <router-outlet></router-outlet>
        </div>
    `
})
export class AppComponent { }