The following code working for me you can refer if you think it helps.
HTML
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('main.js').catch(function(err){ console.error(err); });
</script>
<app-root></app-root>
main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
platformBrowserDynamic().bootstrapModule(AppModule);
The below 2 files are in app folder
app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {AppComponent} from './app.component';
@NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
template: '<h1>Hello World, {{title}}</h1>'
})
export class AppComponent {
protected title:string = "Venkat Konjeti";
}
I am using this code in my sample SPFx web part. I hope the references and code might helpful to trace your problem.
<my-app></my-app>
selector code works perfectly when I write Angular2 App without SharePoint..fnRef.apply is not a function
error in my console.angular2-polyfills.js
reference file to thebeta-12
version. And re-deployed my App. The issue is resolved and also I no longer see the error message offnRef.apply is not a function
.