How to get URL of pages in a non-self collection

I want to do list-and-detail in a page collection that isn't a self collection.

In a self collection it's easy enough, using a template containing this construction:

{% for child in page.collection %}
    <li><a href="{{ page.url }}/{{ child.slug }}">{{ child.title }} </a></li>
{% endfor %}

I can't see how to do it in the case I'm working with, where the collection header is:

    items: 
        '@page': '/PAGENAME'

At least, I can see how to do it if I hardwire the page name into the template, like this:

{% for child in page.collection %}
    <li><a href="/PAGENAME/{{ child.slug }}">{{ child.title }} </a></li>
{% endfor %}

But surely page name shouldn't be hardwired into templates.

What's the right way to do it, please?

Try this:

{% for child in page.collection %}
    <li><a href="{{ child.url }}">{{ child.title }} </a></li>
{% endfor %}

Bingo again! You're good at this. Thank you!

In fact, I now realise I can use child.url in both cases, instead of the clumsier {{ page.url }}/{{ child.slug }}that I was using. Are there any disadvantages or hidden gotchas?

Nope, .url() is always the best approach as it takes into account things like route options in the page.