Usinf App.js Framework并尝试使用photoviewer，但App.load冲突

Question

你好，请查看下面的代码，我正在使用App.js框架创建一个移动web应用程序，我想在用户单击某个按钮时显示照片查看器。但我无法做到这一点，问题是App.load事件可能是冲突的，因为我使用了两次，一次用于"查看器"，一次为"主页"，请告诉我们我可以用查看器做什么来让它在点击按钮时加载，记住这是使用zepto的框架(https://zeptojs.com/)。代码是这样的。。。`

App.controller('home', function (page) {
// put stuff here
});
App.controller('page2', function (page) {
// put stuff here
});
App.controller('page3', function (page) {
// put stuff here
});
App.controller('page4', function (page) {
// put stuff here
});
// in your js
App.controller('viewer', function (page, data) {
var photoViewer = new PhotoViewer(page, data.urls);
});        
// to use the viewer
App.load('viewer', {
urls: [
'images/exercise1pg1.jpg',
'images/exercise1pg2.jpg',
'images/exercise1pg1.jpg',
'images/exercise1pg2.jpg',
'images/exercise1pg1.jpg'
]
});
try {
App.restore(); 
} catch (err) {
App.load('home');
}        
</script>`

Answer 1

您使用的演示示例将参数"page"引用为"viewer"。然而，根据您的代码，您决定将页面称为"主页"(或者第2页、第3页、第4页(。如果您希望PhotoViewer在您的页面上运行，只需将App.controller()和App.load()中的"查看器"替换为"页面"名称，例如"主页"，如下所示：

App.controller('home', function (page, data) {
var photoViewer = new PhotoViewer(page, data.urls); 
}); 
App.load('home', {
urls: [
'images/exercise1pg1.jpg',
'images/exercise1pg2.jpg',
'images/exercise1pg1.jpg',
'images/exercise1pg2.jpg',
'images/exercise1pg1.jpg'
]
});