【问题标题】:Durandal ViewModels activate repeatedly after 2.0.0 upgradeDurandal ViewModels 在 2.0.0 升级后重复激活
【发布时间】:2013-08-30 04:15:30
【问题描述】:

我正在将我的 durandal 项目从 1.2.0 升级到版本 2.0.0。我已按照 durandal 文档 (http://durandaljs.com/documentation/Conversion-Guide/) 中的步骤操作,应用程序现在可以正常运行。我看到的问题是我的激活回调一直被一遍又一遍地调用。

这是正在执行此操作的视图模型之一:

define(['services/datacontext', 'plugins/router', 'services/logger', 'services/model', 'services/images', 'services/pager'],
    function (datacontext, router, logger, model, images, pager) {

        var collaborators = ko.observableArray([]);
        var filterString = ko.observable();
        var pageHandler = new pager();

        var activate = function (filter) {
            return Q.all([datacontext.getAll(model.entityNames.songwriter + 's', "", collaborators, { orderBy: "firstName" })])
                    .then(dataRetrieved)
                    .then(activatePager);

            function dataRetrieved() {
            };

            function activatePager() {
                pageHandler.init.call(pageHandler, collaborators(), {
                    pageSize: 12,
                    filterCallback: function (item) {
                        var filter = filterString().toLowerCase();

                        var pred1 = item.fullName().toLowerCase().indexOf(filter) >= 0;

                        return pred1;
                    }
                });
                if (filter != null) {
                    filterString(filter);
                    pageHandler.applyFilter.call(pageHandler);
                }
            };
        };

        var deactivate = function () {
        };

        var vm = {
            activate: activate,
            deactivate: deactivate,
            collaborators: pageHandler.displayItems,
            title: 'Collaborators',
            images: images,
            router: router,
            pager: pageHandler,
            filterString: filterString
        };

        return vm;
    });

有人见过吗?

这是 chrome 控制台输出:

编辑
这似乎并非在所有视图模型上都发生,这个很好..

define(['durandal/app', 'services/datacontext', 'plugins/router', 'services/logger', 'services/model', 'viewmodels/shared/leftnav', 'viewmodels/modals/imagecrop', 'services/images'],
    function (app, datacontext, router, logger, model, leftnav, imagecrop, images) {
        leftnav.area("Songwriter");

        var songwriter = ko.observable();
        var songwriterId = ko.observable();
        var publishers = ko.observableArray([]);
        var pros = ko.observableArray([]);

        var activate = function (id) {
            songwriterId(id);
            leftnav.entityId(songwriterId());

            return Q.all([datacontext.getEntityById(model.entityNames.songwriter, songwriterId(), "Publisher, Pro", songwriter),
                          datacontext.getAll(model.entityNames.publisher + 's', "", publishers),
                          datacontext.getAll(model.entityNames.pro + 's', "", pros)]);
        };

        var deactivate = function () {
            if (datacontext.hasChanges()) {
                datacontext.cancelChanges();
            }
        };

        var saveClick = function () {
            datacontext.saveChanges().then(saveComplete);

            function saveComplete() {
                router.navigateBack();
            };
        };

        var cancelClick = function () {
            router.navigateBack();
        };

        var imageUploaded = function (e) {
            logger.logSuccess("Image Uploaded Successfully", e.response, "Profile", true);
            songwriter().photoFilePath('/azure/profileimages/' + e.response);

            app.showDialog(imagecrop, {
                title: 'Crop Profile Image',
                message: '<i class="icon-info-sign"></i> Your profile image needs to be cropped to ensure that it does not appear distorted.',
                filePath: songwriter().photoFilePath()
            }).then(appendCropInfo);

            function appendCropInfo(coords) {
                var path = songwriter().photoFilePath;

                path(path() + '?crop=(' + coords.x + ',' + coords.y + ',' + coords.x2 + ',' + coords.y2 + ')');
            };
        };


        var vm = {
            activate: activate,
            deactivate: deactivate,
            songwriter: songwriter,
            publishers: publishers,
            pros: pros,
            title: 'Songwriter',
            cancelClick: cancelClick,
            saveClick: saveClick,
            imageUploaded: imageUploaded,
            images: images
        };

        return vm;
    });

编辑 - 堆栈跟踪

activate (details.js:11)
invoke (activator.js:52)
activate (activator.js:99)
(anonymous function) (activator.js:308)
(anonymous function) (jquery-2.0.3.js:3070)
fire (jquery-2.0.3.js:2914)
self.add (jquery-2.0.3.js:2960)
(anonymous function) (jquery-2.0.3.js:3069)
jQuery.extend.each (jquery-2.0.3.js:590)
(anonymous function) (jquery-2.0.3.js:3065)
jQuery.extend.Deferred (jquery-2.0.3.js:3126)
promise.then (jquery-2.0.3.js:3064)
(anonymous function) (activator.js:306)
(anonymous function) (jquery-2.0.3.js:3070)
fire (jquery-2.0.3.js:2914)
self.add (jquery-2.0.3.js:2960)
(anonymous function) (jquery-2.0.3.js:3069)
jQuery.extend.each (jquery-2.0.3.js:590)
(anonymous function) (jquery-2.0.3.js:3065)
jQuery.extend.Deferred (jquery-2.0.3.js:3126)
promise.then (jquery-2.0.3.js:3064)
(anonymous function) (activator.js:302)
(anonymous function) (jquery-2.0.3.js:3070)
fire (jquery-2.0.3.js:2914)
self.add (jquery-2.0.3.js:2960)
(anonymous function) (jquery-2.0.3.js:3069)
jQuery.extend.each (jquery-2.0.3.js:590)
(anonymous function) (jquery-2.0.3.js:3065)
jQuery.extend.Deferred (jquery-2.0.3.js:3126)
promise.then (jquery-2.0.3.js:3064)
(anonymous function) (activator.js:300)
jQuery.extend.Deferred (jquery-2.0.3.js:3126)
system.defer (system.js:218)
computed.activateItem (activator.js:285)
activateRoute (router.js:248)
handleGuardedRoute (router.js:303)
ensureActivation (router.js:313)
(anonymous function) (router.js:357)
(anonymous function) (jquery-2.0.3.js:3070)
fire (jquery-2.0.3.js:2914)
self.fireWith (jquery-2.0.3.js:3026)
deferred.(anonymous function) (jquery-2.0.3.js:3115)
(anonymous function) (system.js:256)

编辑 - 路线

路由配置如下:

{ route: 'songwriter/:id', moduleId: 'songwriter/details', nav: true, title: 'Profile', settings: { icon: 'icon-edit' } },

【问题讨论】:

  • 第一个视图模型是如何组成的?是局部视图、模态对话框等吗?
  • 第一个视图模型是全视图。它的组成与第二个相同。
  • 很难说。缺少很多代码,我只能猜测它在做什么。将debugger; 添加为activate() 函数的第一行,并单步执行代码以找出持续触发它的原因。
  • 是的,不幸的是,这是一个大型项目的一部分。我已经添加了调试器语句,但是,我无法确定是什么导致它循环。
  • 您使用的是子路由器吗?

标签: durandal


【解决方案1】:

升级到 2.0 后可能与我观察到的问题相同。 我在 Durandal 谷歌群发过一个类似的案例:https://groups.google.com/forum/m/?fromgroups#!topic/durandaljs/rOQ8EfFb1tM

我创建了一个 repo 来重现问题:https://github.com/stiankroknes/durandal-router-problem

【讨论】:

猜你喜欢
  • 2019-01-14
  • 1970-01-01
  • 2017-01-08
  • 1970-01-01
  • 1970-01-01
  • 2014-09-22
  • 1970-01-01
  • 1970-01-01
  • 2022-09-26
相关资源
最近更新 更多