我有一个从按钮调用的模态对话框。一切似乎工作正常,除了我必须将cancelconfirm.html放在viewconfode目录中的cancelconfirm.js文件或它找不到html文件。它正在查看viewmodels目录。
我认为这是我调用showModal()的方式,但我在想,因为我在路由器中使用durandal会知道在哪里查找视图?
app.showModal('areas/share/viewmodels/cancelconfirm')
刚开始durandal,我错过了什么?
由于
这是我的代码设置viewLocator和app root
viewLocator.useConvention('../../areas/share/viewmodels', '../../areas/share/views', '../../areas/share/views');
// show the app start view model
app.setRoot('../../areas/share/viewmodels/shell', 'entrance');
define(function() {
var app = require('durandal/app');
var logger = require('logger/logger');
var router = require('durandal/plugins/router');
function Share(email, downloadProxy, downloadMaster, comment, alertUser) {
this.email = email;
this.downloadProxy = ko.observable(downloadProxy);
this.downloadMaster = ko.observable(downloadMaster);
this.comment = ko.observable(comment);
this.alertUser = ko.observable(alertUser);
}
var shares = ko.observableArray(); // change this variable to recipients
var shareId = ko.observable();
var emailValidator = $("#email").kendoValidator().data("kendoValidator");
var addRecipient = function() {
emailValidator = $("#email").kendoValidator().data("kendoValidator");
if (emailValidator.validate()) {
logger.log("valid email address", "", "adding to share", false);
var newShare = new Share(email.value, false, false, false, false);
shares.push(newShare);
emailValidator.hideMessages();
}
};
function resetEmail() {
email.value = "";
emailValidator.hideMessages();
}
var selectAll = function(share, event) {
logger.log(share, "", "select all", false);
if (event.currentTarget.checked == true) {
share.downloadProxy(true);
share.downloadMaster(true);
share.comment(true);
share.alertUser(true);
} else {
share.downloadProxy(false);
share.downloadMaster(false);
share.comment(false);
share.alertUser(false);
}
return true;
};
var next = function() {
router.navigateTo("#/share/" + shareId + "/settings");
};
var previous = function() {
router.navigateTo("#/share/" + shareId + "/files");
};
var cancel = function() {
app.showModal('areas/share/viewmodels/cancelconfirm').then(function(dialogResult){
// add the storing of the user pref dontShow later
// cookie or true preference?
if(dialogResult.answer == 'Yes') {
window.location.assign("asset");
}
});
};
return {
shares : shares,
addRecipient : addRecipient,
selectAll : selectAll,
resetEmail : resetEmail,
next : next,
previous : previous,
cancel : cancel,
activate : function(context) {
//app.showMessage("Share ==> " + shares()[0].email);
shareId = context.id;
}
};
});
此要求现在正在使用您建议的方法:
仍在查找viewmodels目录中的视图文件。 未捕获错误:/SkyTrack/resources/areas/share/viewmodels/cancelconfirm.html HTTP状态:404
以下是我在main.js中的require config:
require.config({
baseUrl: "/SkyTrack/resources/",
paths: {
text: 'core/durandal/amd/text',
durandal: "core/durandal",
logger: "core/services",
cancelconfirm: "areas/share/viewmodels"
}
});
调用模态的文件顶部的define块: define(function(){ var app = require('durandal / app'); var logger = require('logger / logger'); var router = require('durandal / plugins / router'); var cancelconfirm = require('cancelconfirm / cancelconfirm');
调用模态
的函数 var cancel = function() {
app.showModal(cancelconfirm).then(function(dialogResult){
// add the storing of the user pref dontShow later
// cookie or true preference?
if(dialogResult.answer == 'Yes') {
window.location.assign("asset");
}
});
};
我还必须在shell.js的顶部添加require (我不明白为什么,但直到我做到了,我才得到“尚未加载上下文:_。” 误差)
以下是shell.js的完整内容:
define(function (require) {
var router = require('durandal/plugins/router');
var logger = require('logger/logger');
var cancelconfirm = require('cancelconfirm/cancelconfirm');
return {
router : router,
activate : function () {
logger.log("shell init activate share", "", "share shell", false);
//router.mapNav("addshare");
router.mapNav("files");
router.mapNav("recipients");
router.mapNav("settings");
router.mapNav('cancelconfirm');
//allows regular links to work (so you can navigate between multiple SPA's)
Sammy.Application.prototype.disable_push_state = true;
return router.activate('files');
}
};
});
的 的 ** * ** * ** * 的**** main.js的列表
require.config({
baseUrl: "/SkyTrack/resources/",
paths: {
text: 'core/durandal/amd/text',
durandal: "core/durandal",
logger: "core/services",
cancelconfirm: "areas/share/viewmodels/cancelconfirm"
}
});
define(function (require) {
var app = require('durandal/app'),
viewLocator = require('durandal/viewLocator'),
viewModelBinder = require('durandal/viewModelBinder'),
system = require('durandal/system'),
router = require('durandal/plugins/router'),
logger = require('logger/logger');
system.debug(true);
logger.log("using durandal", "", "main", false);
app.title = "Share My Assets";
app.start().then(function () {
// kendo configuration
// Configure kendo data binding attribute prefix
kendo.ns = "kendo-";
logger.log("Configured kendo data binding prefix = 'data-kendo-*'", "", "main", false);
// Add Durandal beforeBind event handler that will apply
// Kendo data binding every time a viewModel is bound to a view
viewModelBinder.beforeBind = function (viewModel, view) {
logger.log("Applying Kendo data binding", "", "viewModelBinder", false);
// Find all Kendo templates and add to the DOM before
// bind is called
var templates = $("script[type='text/x-kendo-template']", view);
templates.each(function(i,item){
$(document.body).append(item);
});
try
{
if(viewModel.kendoViewModelPropertyName != null)
{
kendo.bind(view, viewModel[viewModel.kendoViewModelPropertyName]);
}
else
{
kendo.bind(view, viewModel);
}
}
catch(e)
{
logger.log("Error applying kendo MVVM bindings: " + e.message);
}
};
// configure routing
router.useConvention('../../areas/share/viewmodels');
viewLocator.useConvention('../../areas/share/viewmodels', '../../areas/share/views', '../../areas/share/views');
app.adaptToDevice();
// show the app start view model
app.setRoot('../../areas/share/viewmodels/shell', 'entrance');
});
});
答案 0 :(得分:1)
请尝试使用此方法:
var cancelconfirm = require('cancelconfirm');
app.showModal(cancelconfirm);
使用这种方法,您将加载视图模型并将其传递给showModal
调用。然后,showModal
将使用viewLocator
来查找与视图模型关联的视图。通过这种方式,您并不是非常依赖durandal来找到合适的视图模型,而是允许requirejs为您加载模块,让出售的durandal找到视图。