I have something like this in my visualforce I need to pass vars to my component because all files are in the Static Resource.

which is the correct way?

var opp="{!opportunity}";
var resource="{!URLFOR($Resource.components,'app/')}";

    packages: {        
      app: {
        format: 'register',
        defaultExtension: 'js'
        .then(null, console.error.bind(console));

Static Resource app/main.ts

import { bootstrap }    from 'angular2/platform/browser';
import { AppComponent } from './app.component';

Static Resource app/app.component.ts

import { Component } from 'angular2/core';
           selector: 'pm-app',
           templateUrl: 'app/app.component.html',
export class AppComponent {
opp: string = '';
  • may be wrapping in anonymous self executing function .The merge fields can be stored in window global variables Apr 15 '16 at 4:29
  • What you want is how to reference properly a static resource in a Visualforce page?
    – MANUELAN00
    Apr 15 '16 at 4:35

Angualar 2 is mostly written using Typescript which needs to be transpiled to Javascript before it can run inside your browser.

You cannot create typescript static resources and reference them from a VF page as your browser will not understand it.

Have a look at these tutorials how to work with angular 2 using your VF page as a container. running Angular 2 inside VF page tutorial


No need of using static resource. Use salesforce component for you javascript code and visualforce page for template...it will work with all available salesforce controllers data.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.