Forum How do I...?

target-counter not working in app

amyd
I can get target-counter to work using PrinceXML through the console command-line just fine, but if I use the exact same code in our real app, and send it to the back-end service, it does not work. I've tried giving it more specific CSS (an ID instead of a class, etc.) and many other things, but I cannot get anything to come through.

Has anyone experienced this kind of problem? It's an Angular 7 app. I'm about to get counter(page) to come through, but I need target-counter for my table of contents. Advice would be greatly appreciated.

The code I use is:
<style>
.bodymatter a::after { content: leader('.') target-counter(attr(href url), page, decimal);
</style>

<nav>
<ul>
<li class="bodymatter"><a href="#page02">Page Two</a></li>
<li class="bodymatter"><a href="#page03">Page Three</a></li>
<li class="bodymatter"><a href="#page04">Page Four</a></li>
</ul>
</nav>
mikeday
Do you get the leader appearing and the counter shows up always as zero? Is there only one input HTML document or are multiple input documents being used to generate a single PDF?
amyd
There is only one input HTML document.

I do not get the leader or the counter showing up with zero. Putting target-counter in makes the entire CSS line inoperable.This works fine:

.bodymatter a::after { content: leader('.') counter(page);}

but using target-counter instead of counter does not work.
mikeday
Actually I just noticed a missing close brace } after the rule, is that it? :)

Also which version of Prince are you using? Older versions did not support the attr(href url) syntax, they needed a comma like attr(href, url).
amyd
Thank you! We must be using an older version of Prince because putting the comma in fixed the problem.

I appreciate your quick response! Very helpful.