Lost data when navigating back through pages

I have sketched out what I thought was a relatively simple setup: a home-page link which leads to a page of speakers, which lead to a further information page when clicked. This all works fine; However, upon working back through the pages, I am getting the following error:

TypeError: ctx_2.company is undefined
Stack trace:
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js line 2368 > eval:15:388
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:2436:18
@file:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js line 2368 > eval:7:3047
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:4819:47
window.Framework7/[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:5313:31
proceed/<@file:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:5697:21
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:4728:21
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:5695:17
window.Framework7/app.router.back/<@file:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:5731:25
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:4206:25
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:1726:36
[email protected]:///C:/Users/Mat/Work/Sites/App/www/js/framework7.js:1902:5

The company names continue to show, so I am not sure where this error is coming from. It does however, prevent returning to the home page.

Any help would be greatly appreciated.

My files:

index.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>My App</title>
		<!-- Path to Framework7 Library CSS-->
		<link rel="stylesheet" href="css/framework7.ios.min.css"></link>
		<link rel="stylesheet" href="css/framework7.ios.colors.min.css"></link>
		<!-- Path to your custom app styles-->
		<link rel="stylesheet" href="css/my-app.css"></link>
	</head>
	<body>
		<!-- Status bar overlay for fullscreen mode-->
		<div class="statusbar-overlay"></div>
		<!-- Panels overlay-->
		<div class="panel-overlay"></div>
		<!-- Left panel with reveal effect-->
		<div class="panel panel-left panel-reveal">
			<div class="content-block">
				<p>Left panel content goes here</p>
			</div>
		</div>
		<!-- Right panel with cover effect-->
		<div class="panel panel-right panel-cover">
			<div class="content-block">
				<p>Right panel content goes here</p>
			</div>
		</div>
		<!-- Views-->
		<div class="views">
			<!-- Your main view, should have "view-main" class-->
			<div class="view view-main">
				<!-- Top Navbar-->
				<div class="navbar">
					<div class="navbar-inner">
						<!-- We have home navbar without left link-->
						<div class="left">
							<!-- Right link contains only icon - additional "icon-only" class--><a href="#" class="link icon-only open-panel"> <i class="icon icon-bars"></i></a>
						</div>
						<div class="center sliding">PI Apparel</div>
					</div>
				</div>
				<!-- Pages, because we need fixed-through navbar and toolbar, it has additional appropriate classes-->
				<div class="pages navbar-through toolbar-through">
					<!-- Page, data-page contains page name-->
					<div data-page="index" class="page">
						<!-- Scrollable page content-->
						<div class="page-content">
							<!-- <div class="content-block-title">Welcome To My Awesome App</div>
							<div class="content-block">
								<div class="content-block-inner">
									<p>Couple of worlds here because my app is so awesome!</p>
									<p>Duis sed erat ac eros ultrices pharetra id ut tellus. Praesent rhoncus enim ornare ipsum aliquet ultricies. Pellentesque sodales erat quis elementum sagittis.</p>
								</div>
							</div> -->
							<div class="content-block-title">What about simple navigation?</div>
							<div class="list-block">
								<ul>
									<li><a href="speakers.html" class="item-link">
											<div class="item-content">
												<div class="item-inner"> 
													<div class="item-title">Speakers</div>
												</div>
											</div></a></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- template7 templates -->
		<script type="text/template7" id="speakersTemplate">
			<ul>
			{{#each this}}
				<li>
					<a href="speaker.html" class="item-link item-content" data-context='{"index": {{@index}}, "name": "{{first_name}} {{last_name}}"}'>
						<div class="item-media"><img src="{{#if image}}{{image}}{{else}}img/empty.jpg{{/if}}" width="80"></div>
						<div class="item-inner">
							<div class="item-title-row">
								<div class="item-title">{{first_name}} {{last_name}}</div>
							</div>
							<div class="item-subtitle"></div>
							<div class="item-text">{{job_title}}<br>{{company.name}}</div>
						</div>
					</a>
				</li>
			{{/each}}
			</ul>
		</script>

		<script type="text/template7" id="speakerTemplate">
			<div class="card">
				<div class="card-content">
					<div class="card-content-inner">
						<img src="{{#if image}}{{image}}{{else}}img/empty.jpg{{/if}}"  style="max-width: 100%;">
						<p><strong>{{first_name}} {{last_name}}</strong><br>
						{{job_title}}<br>{{company.name}}</p>
						{{bio}}
					</div>
				</div>
			</div>
			
			<div class="content-block-title">Sessions</div>
				{{#each this.sessions}}
					<div class="card">
						<div class="card-content">
							<div class="card-content-inner">{{title}}</div>
						</div>
						<div class="card-footer">{{time}} {{room}}</div>
					</div>
				{{/each}}
		</script>

		<!-- Path to Framework7 Library JS-->
		<script type="text/javascript" src="js/framework7.js"></script>
		<!-- Path to your app js-->
		<script type="text/javascript" src="js/my-app.js"></script>
	</body>
</html>

my-app.js

// Initialize your app
    var myApp = new Framework7({
    	precompileTemplates: true,
    	template7Pages: true
    });


// Export selectors engine
var $$ = Dom7;

// Add view
var mainView = myApp.addView('.view-main', {
	// Because we use fixed-through navbar we can enable dynamic navbar
	dynamicNavbar: true
});

// Callbacks to run specific code for specific pages, for example for About page:
myApp.onPageInit('speakers', function (page) {
	getSpeakers();
});

myApp.onPageInit('speaker', function (page) {
	getSpeaker(page.context.index);
});

function updateSpeakers(speakers){
	$$('#speakers_container').html(Template7.templates.speakersTemplate(speakers));
}

function getSpeakers(){
	var speakers = [{"id":"123","first_name":"Person","last_name":"One","image":"http://via.placeholder.com/400x400", "job_title":"VP, Such and Such","bio":"<p>This is the bio<\/p>","company":{"id":"12345","name":"Company One"},"sessions":[{"id":"1357","title":"Session 1","room":"Room 1","type":"general","time":"2016-10-05 11:25:00"}]},{"id":"124","first_name":"Person","last_name":"Two","image":"http://via.placeholder.com/400x400", "job_title":"CEO","bio":"<p>This is the bio<\/p>","company":{"id":"12346","name":"Company Two"},"sessions":[{"id":"2468","title":"Session 2","room":"Room 2","type":"general","time":"2016-10-05 11:25:00"}]}];
	updateSpeakers(speakers);
}


function getSpeaker(index){
	var speaker = {"id":"123","first_name":"Person","last_name":"One","image":"http://via.placeholder.com/400x400", "job_title":"VP, Such and Such","bio":"<p>This is the bio<\/p>","company":{"id":"12345","name":"Company One"},"sessions":[{"id":"1357","title":"Session 1","room":"Room 1","type":"general","time":"2016-10-05 11:25:00"}]};

	$$('#speaker_container .page-content').html(Template7.templates.speakerTemplate(speaker));
}

Try to use domCache: true in addView function as a parameter, maybe this will solve.

http://framework7.io/docs/pages-inline.html#enable-inline-pages