Requirejs 在Durandal中的视图之间传递数据
我有一个带有网格的视图，从中我在新窗口中启动了一个不同的视图。父视图需要将数据传递给子视图，并且不能作为查询字符串传递，因为它非常大。我不能使用本机模态。我只是在使用window.open，还没有创建自定义模式上下文。我尝试过的东西 1。尝试使用下面的代码填充新窗口中的隐藏字段元素Requirejs 在Durandal中的视图之间传递数据,requirejs,durandal,Requirejs,Durandal,我有一个带有网格的视图，从中我在新窗口中启动了一个不同的视图。父视图需要将数据传递给子视图，并且不能作为查询字符串传递，因为它非常大。我不能使用本机模态。我只是在使用window.open，还没有创建自定义模式上下文。我尝试过的东西 1。尝试使用下面的代码填充新窗口中的隐藏字段元素 var popup = window.open('/#/viewname'); popup.onload=function(){document.findbyid('hiddenfield')= newvalue }
var popup = window.open('/#/viewname');
popup.onload=function(){document.findbyid('hiddenfield')= newvalue };
define(['viewmodels/parent'],function ('parent'){
function activate(){
localvariablevalue= parent.observable;
}
return{
activate:activate
}
});
var popup = window.open('/#/viewname');
popup.onload=function(){document.findbyid('hiddenfield')= newvalue };
define(['viewmodels/parent'],function ('parent'){
function activate(){
localvariablevalue= parent.observable;
}
return{
activate:activate
}
});
关于如何实现这一点有什么想法吗。。是否可以使用V1.2实现？如果可以通过创建自定义模式上下文来实现，那么有人可以提供一些关于如何为新窗口定义addContext函数的指针。使用
窗口。打开创建与第一个SPA无关的#/viewname
SPA的独立实例。如果你真的需要打开一个新窗口，那么你需要寻找其他方式在窗口之间交换信息，例如
但是你最好重新考虑一下需求，看看你是否能用情态动词来实现这个目标
根据评论进行编辑：这与Durandal放松上下文无关，而是关于窗口。打开
而不是在同一会话中打开。见例
Edit2作为替代方法，您可以在第二个windowsvm中使用param#/viewname
。激活
，直接从服务器（如果适用）或通过第一个浏览器的localstorage或sessionstorage等方式检索数据
Edit3我做了一个快速测试，看看是否可以使用窗口完成。单独打开。在Firefox/Firebug中测试。我仍然建议签出链接，以确保跨浏览器工作
转到，打开控制台并创建全局变量：
window.myVar = {complex: true};
创建一个新窗口
var myWindow = window.open('http://dfiddle.github.io/dFiddle-1.2/#/view-composition');
返回第一个控制台并在myWindow上创建属性myvar
myWindow.myVar = myVar;
切换到第二个窗口的控制台并检查
myVar // output {complex: true}
我建议的替代方法是使用传递到第二个窗口的唯一哈希值，然后作为activate
回调的一部分检索复杂数据（可以作为查询字符串添加）。数据可以存储在服务器上或通过Web存储。Rainer感谢您的帮助。以下代码将生成最大化模态。在此阶段，我将退出此解决方案，并在showModal中以激活方式传递数据。它是默认模式上下文的精确副本，css有一些小的变化。但是如果它能帮助别人的话，就发布它
1。CSS
.modalHostMax {
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
position: fixed;
opacity: 0;
-webkit-backface-visibility: hidden;
-webkit-transition: opacity 0.1s linear;
-moz-transition: opacity 0.1s linear;
-o-transition: opacity 0.1s linear;
transition: opacity 0.1s linear;
}
.modalMax {
width: 100%;
height: 100%;
}
2.新的模态上下文
var addContext = function (contextName) {
modalDialog.addContext(contextName, {
blockoutOpacity: .2,
removeDelay: 200,
addHost: function (modal) {
var body = $('body');
var blockout = $('<div class="modalBlockout"></div>')
.css({ 'z-index': modalDialog.getNextZIndex(), 'opacity': this.blockoutOpacity })
.appendTo(body);
var host = $('<div class="modalHostMax"></div>')
.css({ 'z-index': modalDialog.getNextZIndex() })
.appendTo(body);
modal.host = host.get(0);
modal.blockout = blockout.get(0);
if (!modalDialog.isModalOpen()) {
modal.oldBodyMarginRight = $("body").css("margin-right");
var html = $("html");
var oldBodyOuterWidth = body.outerWidth(true);
var oldScrollTop = html.scrollTop();
$("html").css("overflow-y", "hidden");
var newBodyOuterWidth = $("body").outerWidth(true);
body.css("margin-right", (newBodyOuterWidth - oldBodyOuterWidth + parseInt(modal.oldBodyMarginRight)) + "px");
html.scrollTop(oldScrollTop); // necessary for Firefox
$("#simplemodal-overlay").css("width", newBodyOuterWidth + "px");
}
},
removeHost: function (modal) {
$(modal.host).css('opacity', 0);
$(modal.blockout).css('opacity', 0);
setTimeout(function () {
$(modal.host).remove();
$(modal.blockout).remove();
}, this.removeDelay);
if (!modalDialog.isModalOpen()) {
var html = $("html");
var oldScrollTop = html.scrollTop(); // necessary for Firefox.
html.css("overflow-y", "").scrollTop(oldScrollTop);
$("body").css("margin-right", modal.oldBodyMarginRight);
}
},
afterCompose: function (parent, newChild, settings) {
var $child = $(newChild);
var width = $child.width();
var height = $child.height();
$child.attr('class', 'modalMax');
$(settings.model.modal.host).css('opacity', 1);
if ($(newChild).hasClass('autoclose')) {
$(settings.model.modal.blockout).click(function () {
settings.model.modal.close();
});
}
$('.autofocus', newChild).each(function () {
$(this).focus();
});
}
});
};
var addContext=function（contextName）{
modalDialog.addContext（contextName{
blockoutOpacity:.2，
移除时间：200，
addHost：函数（模态）{
变量body=$（'body'）；
变量封锁=$（''）
.css（{'z-index'：modalDialog.getNextZIndex（），'opacity'：this.blockoutOpacity}）
.附于（正文）；
变量主机=$（“”）
.css（{'z-index'：modalDialog.getNextZIndex（）}）
.附于（正文）；
modal.host=host.get（0）；
modal.blockout=blockout.get（0）；
如果（！modalDialog.isModalOpen（））{
modal.oldBodyMarginRight=$（“正文”）.css（“右边距”）；
var html=$（“html”）；
var oldboyouterwidth=body.outerWidth（true）；
var oldcollScrollTop=html.scrollTop（）；
$（“html”）.css（“溢出”、“隐藏”）；
var newbodyyouterwidth=$（“body”）.outerWidth（true）；
css（“右边距”（newbodyyouterwidth-oldboyouterwidth+parseInt（modal.oldboymarginright））+“px”）；
html.scrollTop（oldScrollTop）；//对于Firefox来说是必需的
$（“#simplemodal覆盖”）.css（“宽度”，newBodyOuterWidth+“px”）；
}
},
removeHost:功能（模式）{
$（modal.host）.css（'opacity'，0）；
$（modal.blockout）.css（'opacity'，0）；
setTimeout（函数（）{
$（modal.host）.remove（）；
$（modal.blockout）.remove（）；
}，这个。删除了）；
如果（！modalDialog.isModalOpen（））{
var html=$（“html”）；
var oldcollScrollTop=html.scrollTop（）；//是Firefox所必需的。
css（“overflow-y”，”）.scrollTop（oldScrollTop）；
$（“body”）.css（“右边距”，modal.oldbody右边距）；
}
},
afterCompose：函数（父级、新子级、设置）{
变量$child=$（newChild）；
var width=$child.width（）；
var height=$child.height（）；
$child.attr（'class'，'modalMax'）；
$（settings.model.modal.host）.css（'opacity'，1）；
if（$（newChild）.hasClass（'autoclose'））{
$（settings.model.modal.bl）