I'm using AngularDart for a new application of mine. I have a component set up like so:
@NgComponent(
selector: 'game-timeline',
templateUrl: '/static/dart/game/web/views/timelineview.html',
cssUrl: '/static/dart/game/web/views/timelineview.css',
publishAs: 'ctrl'
)
But my problem is, the template and css locations aren't necessarily known at build-time. They'll be on a CDN with a unique deploy-identifier on them. Something like...
http://cdn.domain.com/static/30294832098/dart/game/web/views/timelineview.html
And that number varies every deploy.
The path seems to be relative to the html page it's hosted on, which is not on the CDN, so I can't just use a relative path (../blah/blah)
I can inject a JS variable into the page telling me where the static root it, if that helps.
The main .dart/.js file is loaded from the CDN, but I can't seem to make it be relative to that.
Any ideas?
Update, here's my full solution adapted from pavelgj's great answer that reads in a js variable called STATIC_URL on the page.
import 'package:angular/angular.dart';
import 'package:js/js.dart' as js;
class CDNRewriter implements UrlRewriter {
String staticUrl;
CDNRewriter() {
var context = js.context;
staticUrl = js.context.STATIC_URL;
}
String call(String url) {
if (url.startsWith('/static/')) {
return _rewriteCdnUrl(url);
}
return url;
}
String _rewriteCdnUrl(String url) {
return url.replaceFirst(new RegExp(r'/static/'), staticUrl);
}
}