separate limiter values with a pipe (|)
It can be easily done by CSS.
I always prefer CSS for this kind of tweaks.
.limiter .control a + a::before {
content: " | ";
}
It will Add a Pipe separator between a tag
Demo can be found at Fiddle
Hope above will help!
Try using PHP implode(), check below modified code:
<div class="field limiter">
<label class="label" for="limiter">
<span><?= /* @escapeNotVerified */ __('View:') ?></span>
</label>
<div class="control">
<?php foreach ($block->getAvailableLimit() as $_key => $_limit): ?>
<a data-role="limiter" href="#" data-value="<?php /* @escapeNotVerified */ echo $_key ?>"<?php if ($block->isLimitCurrent($_key)): ?>
class="selected"<?php endif ?>>
<?php /* @escapeNotVerified */ echo implode("|",$_limit) ?>
</a>
<?php endforeach; ?>
</div>
</div>