Angular2 component without view annotation

Question

I would like to be able to use Angular2 to do client-side databinding on my server-rendered pages (ASP.Net MVC6).

Is it possible to do this without adding a @view template? Instead of defining it inline or creating an external template, I would like to enclose a block of server-rendered HTML with the app element. This was how I did it in Angular1, as it allows me to choose whether to databind on the server-side or on the client-side.

Thanks.

Answer 1

You can do something similar, that is probably what you want. Take this example:

import {Component, View, bootstrap} from "angular2/angular2";

@Component({
    selector: "app"
})
@View({
    template:  "<content></content>"
})
export class App {
    public name: string;

    constructor() {
        this.name = "MyName";
    }
}
bootstrap(App);

The template has a special content <content></content> that represents the ngTransclude directive. This will allow you to add content inside the app tag:

<app>
    <h1>Hello World</h1>
</app> 

Unfortunately this is still poorly undocumented and changing so it's hard to tell about the actual limitations or even if this will remain like this.

Regards.