Access a variable outside the foreach loop

Hi everyone,
I’m printing a list of card using a foreach loop in Framwork7.
for one card I need to show a value that is stored in an another variable. how can I do that,

apps: {
applications: [app1,app2,app3],
price: [price1,price2,price3,price4],}

inside one of my page

{{#each $root.apps.applications}}


price : {{$root.apps.price[3]}}


but that’s not working.

I’m waiting for a help.
Thank you,

The “$root” doesn’t point to scoped context.
You‘d better pass val to scoped context then render it.

data:(){return {price:array}}

1 Like

In Template7 you can access one level up (parent) context with ../ like {{../price.3}}


Thank you @hongfu
I tried but I couldn’t be success.

Thank you.
I’m using Framwork7 V 2.0.1
Is it possible to do this, could you please give me a guide or any reference for it.
Thank you !

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<meta name="theme-color" content="#2196f3">
<meta http-equiv="Content-Security-Policy" content="default-src * 'self' 'unsafe-inline' 'unsafe-eval' data: gap:">
<link rel="stylesheet" href="">
<div id="app">
<div class="statusbar"></div>
<div class="view view-main">
    <div class="page" data-name="test">
        <a href="/t/">test</a>
<script src=""></script>
    var remoteVar = {apps: {
                        applications: ['app1','app2','app3'],
                        price: ['price1','price2','price3','price4'],
    var app = new Framework7({
    root: '#app',
    theme: 'md',
    routes: [{
        path: '/t/',
        // Component Object
        component: {
            template: `
                <div class="page">
                <div class="page-content">
                    <div class="list simple-list">
            data: function () {
                 /*The data is processed logically here*/
                return remoteVar;
    on: {
        pageInit: function(e,page){


    var MV = app.views.create('.view-main');
1 Like

{{#apps}} is works? may be {{#each apps}} ?

1 Like

Hi… its working {{…/VariableName}} But how to use it with {{js “…/VariableName -this.price”}} Its actually not working with js and we can’t do mathematics actions without it… Please help.

…/VariableName => this.@root

1 Like

Worked like Charm… Thank you !!!