Simoyw
Simoyw

Reputation: 691

How to refer to a template by id in angular2?

I'm trying to find a way to refer to a file by using an unique name instead of a folder path. With absolute and relative path, if I move the components folder I have to refactor all the link. That is quite annoying also because by using gulp all the javascript file are moved to another directory.

In Angular 1 we just refer to the ID of the ng-template.

Is there a way to do a similar thing in Angular 2?

Additional information:

Code I'm currently using

(function(app) {
    app.AppComponent =
        ng.core.Component({
            selector: 'my-app-test',
            templateUrl: '/assets/base/components/comp-test-app/test-template.html'
        })
            .Class({
                constructor: function() {}
            });
})(window.app || (window.app = {}));

Upvotes: 1

Views: 580

Answers (1)

Brandyn Bayes
Brandyn Bayes

Reputation: 146

You can reference the template by relative urls by setting the moduleId of the component.

(function(app) {
    app.AppComponent =
        ng.core.Component({
            moduleId: module.id,
            selector: 'my-app-test',
            templateUrl: 'test-template.html'
        })
        .Class({
            constructor: function() {}
        });
})(window.app || (window.app = {}));

Source: https://angular.io/docs/ts/latest/cookbook/component-relative-paths.html

Upvotes: 1

Related Questions