[SOLVED] How to load a popup from data-url

Questions
1

I want to load a page (saved as external file) as a popup. What is the easiest way?

 <div class="list links-list">
     <ul>
         <li><a href="#" class="popup-open" data-popup="#about">About</a></li>
     </ul>
 </div>
 <div id="about" class="popup" data-name="about" data-url="/about/"></div>

routes.js :

var routes = [
 {
    path: '/about/',
    popup : {
        componentUrl: '../pages/about.f7'
    }
  }
]

about.f7 :

<template>
    <div class="popup">
        <div class="view">
            <div class="page">
                <div class="navbar">
                    <div class="navbar-bg"></div>
                    <div class="navbar-inner">
                        <div class="title">About</div>
                        <div class="right">
                            <a href="#" class="link popup-close">Close</a>
                        </div>
                    </div>
                </div>
                <div class="page-content">
                    <div class="block">
                        <p>About...</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

The popup is shown without any content. What do I need to do?

2

I solved it by changing this line:

<div class="list links-list">
     <ul>
         <li><a href="#" class="popup-open" data-popup="#about">About</a></li>
     </ul>
 </div>
 <div id="about" class="popup" data-name="about" data-url="/about/"></div>

To:

<div class="list links-list">
     <ul>
         <li><a href="/about/" class="link popup-open">About</a></li>
     </ul>
 </div>