Durandal模式找不到视图

我有一个从按钮调用的模式对话框。除了我必须将cancelconfirm.html与cancelconfirm.js文件一起放在viewmodels目录中，或者它找不到html文件之外，一切似乎都正常。它正在viewmodels目录中查找它

我想这是我调用showModal（）的方式，但我想既然我的路由器中有它，durandal就知道在哪里可以找到视图了

app.showModal('areas/share/viewmodels/cancelconfirm')

刚开始durandal，我错过了什么

谢谢

下面是我设置viewLocator和应用程序根目录的代码

    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"         
    }
});

调用模式的文件顶部的“定义”块： 定义（函数（）{ var app=要求（'durandal/app'）； var记录器=需要（'记录器/记录器'）； 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 （我不太明白为什么，但在我这么做之前，我得到的是“尚未为上下文加载：389;” （错误）

以下是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');
    });

});

---

请尝试以下方法：

var cancelconfirm = require('cancelconfirm');
app.showModal(cancelconfirm);

---

使用这种方法，您将加载视图模型并将其传递给

showmodel

调用。

showmodel

然后将使用

viewLocator

来定位与视图模型关联的视图。这样，您就不太依赖durandal来找到合适的视图模型，而是允许requirejs为您加载模块，并让durandal定位视图。

尝试以下方法：

var cancelconfirm = require('cancelconfirm');
app.showModal(cancelconfirm);

---

使用这种方法，您将加载视图模型并将其传递给

showmodel

调用。

showmodel

然后将使用

viewLocator

来定位与视图模型关联的视图。这样，您就不太依赖durandal来找到合适的视图模型，而是允许requirejs为您加载模块并让durandal定位视图。

您调用

app.showmodel

的原因不仅仅是：`app.showmodel（'cancelConfirm'）？因为您正在设置约定，所以不需要在showmodel中指定视图/模型的具体位置。当我将其更改为app.showmodel时(“cancelconfirm”）它试图在my main.js中配置的baseUrl中定位viewmodel，但似乎没有使用约定设置。在then after app.start（）的main.js中，您的useConvention调用位于何处我还有三个其他视图工作得很好，它们使用的是约定，但是它们不是模态。在调试中，我可以看到cancelconfirm在我的visibleRoutes中，如果我使用router.navigate导航到它，所有内容都会被找到并显示，当然不是在模态中，这正是我想要的。您调用

app.showModa有什么原因吗l

不仅仅是：`app.showmodel（'cancelConfirm'）？因为您正在设置约定，所以不需要在showmodel中指定视图/模型的特定位置。当我将其更改为app.showmodel（“cancelConfirm”）时它试图在my main.js中配置的baseUrl中定位viewmodel，但似乎没有使用约定设置。在then after app.start（）的main.js中，您的useConvention调用位于何处我还有另外三个视图工作得很好，它们使用的是约定，但是它们不是模态。在调试中，我可以看到cancelconfirm在我的visibleRoutes中，如果我使用router导航到它。navigate到所有内容都被找到并显示，当然不是在模态中，这就是我要找的。未捕获错误：模块名称“cancelconfirm”“尚未加载上下文：\的。请使用require（[]）”看起来我在require js中缺少了一个定义，尝试了链接中的一些东西，添加了该定义，目前为止运气不好。来自java背景，js很强。你能用试图显示此模式的视图模型中的代码更新你的问题吗？用js文件的内容更新了原始问题，cancel函数调用modalI没有看到您正在执行

require（'cancelconfirm'）

？在require.config中，您有：

cancelconfirm:“区域/共享/视图模型”

。这告诉require，当您请求

cancelconfirm

时，请从

区域/share/viewmodels.js

获取它。尽管此处的配置名

路径

，但这不是它要查找的目录，require将其视为要加载的特定路径和文件。未捕获错误：模块名“cancelconfirm”尚未加载上下文：\的。请使用require（[]）看起来我在require js中缺少了一个定义，尝试了链接中的一些东西，添加了该定义，目前为止运气不好。来自java背景，js很强。你能用试图显示此模式的视图模型中的代码更新你的问题吗？用js文件的内容更新了原始问题，cancel函数调用modalI没有看到您正在执行

require（'cancelconfirm'）

？在require.config中，您有：

cancelconfirm:“区域/共享/视图模型”

。这告诉require，当您请求

cancelconfirm

时，请从

areas/share/viewmodels.js

获取它。尽管此处的配置名

path

，但这不是它要查找的目录，require将其视为要加载的特定路径和文件。