Angular JS directive - location of CSS file relative to HTML -


my directive uses html file. html file uses css stylesheet. need distribute directive js, html , css files, css location definition needs relative html.

note: this how solved location of html, have pending solve location of css file.

i put css file in same folder html file, , defined in html:

<link rel="stylesheet" href='somefile.css'> 

however points domain root, not html file location.

any ideas how achieve this?

i think there 2 ways fix issue don't know directives located:

solution 1 - ancient html way

if length of css small, can directly include in template html itself, through style tag.

<style type="text/css">     add style rules here </style> 

solution 2 - angular way(most recommended)

use nghref directive.

in directive.js code, can put path of directive.html scope/rootscope variable , can access directive.html

in directive.js

link: function (scope, ielement, iattrs) {      scope.htmlpath = <path of templateurl>;  } 

in directive.html

<link rel="stylesheet" ng-href="{{ htmlpath }}/filename.css"> 

note:

i hope not using gulp build angular js code. but, if using gulp, can add gulp task , pipe css single css , can inject index.


Comments

Popular posts from this blog

magento2 - Magento 2 admin grid add filter to collection -

Android volley - avoid multiple requests of the same kind to the server? -

Combining PHP Registration and Login into one class with multiple functions in one PHP file -