I am using typescript with angular 1.5 component. And I have a custom designed decorator where I send template via require. It works except I get a tslint warning. (I don't want to turn off this rule)
require() style import is forbidden
Here is my component
import './main.template.html';
const app: ng.IModule = angular.module('app');
@Component(app, {
selector: 'mainComponent',
controllerAs: 'ctrl',
styleUrls: '',
template: require('./main.template.html')
})
class MainComponent extends BaseComponent {
constructor() {
super();
}
}
Here is my decorator
export const Component = function(module: ng.IModule, options: {
selector: string,
controllerAs?: string,
styleUrls?: string,
template?: string,
templateUrl?: string
}) {
return (controller: Function) => {
module.component(options.selector, angular.extend(options, { controller: controller }));
};
};
I have tried to pass templateUrl instead of template and i get run time error of file not found.
I have also tried to import template as variable and it gives compile time error and looks like it's not supported.
import mytemplate: string from './main.template.html';
I am using webpack. Hence, can't use absolute path from the root.
Do you have any idea how to import template in typescript without using require.
For templateUrl error , check your reference and directory structure.
Or , insert html data inside template :-
@Component(app, {
selector: 'mainComponent',
controllerAs: 'ctrl',
styleUrls: '',
template: `<div>//content
</div>`
})
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.