Question

问题

Durandal 或者 RequireJS 似乎使我的属性为null。我的主视图模型有3个子模型（ PostModel ， CategoryModel ， TagModel ），所有这些模型最终都是空对象。

CODE

主要档案：blog.js

var viewModel;

define(['jquery', 'knockout', 'datajs', 'OData', 'Q', 'breeze', 'blog-posts', 'blog-categories', 'blog-tags'],
    function ($, ko, datajs, odata, Q, breeze, posts, categories, tags) {
        'use strict'

        var ViewModel = function () {
            var self = this;

            self.postModel = false;
            self.categoryModel = false;
            self.tagModel = false;

            self.activate = function () {
                self.postModel = new posts();
                self.categoryModel = new categories();
                self.tagModel = new tags();
            };
            self.attached = function () {
                breeze.config.initializeAdapterInstances({ dataService: "OData" });
                self.postModel.init();
                self.categoryModel.init();
                self.tagModel.init();
            };
            self.showCategories = function () {
                //.....
            };
            self.showPosts = function () {
                //.....
            };
            self.showTags = function () {
                //.....
            };
        };

        viewModel = new ViewModel();
        return viewModel;
    });

post.js

define(['jquery', 'jqueryval', 'knockout', 'kendo', 'kendo-knockout', 'notify'],
    function ($, jqueryval, ko, kendo, ko_kendo, notify) {
        'use strict'

        var PostModel = function () {
            var self = this;

            self.id = ko.observable(0);
            self.categoryId = ko.observable(0);
            self.headline = ko.observable(null);
            self.slug = ko.observable(null);
            self.teaserImageUrl = ko.observable(null);
            self.shortDescription = ko.observable(null);
            self.fullDescription = ko.observable(null);
            self.useExternalLink = ko.observable(false);
            self.externalLink = ko.observable(null);
            self.metaKeywords = ko.observable(null);
            self.metaDescription = ko.observable(null);

            self.availableTags = ko.observableArray([]);
            self.chosenTags = ko.observableArray([]);

            self.init = function () {
                //..... this code runs fine (initializes a Kendo Grid)
            };
            self.create = function () {
                //.....
            };
            self.edit = function (id) {
                //.....
            };
            self.remove = function (id) {
                //.....
            };
            self.save = function () {
                //.....
            };
            self.cancel = function () {
                //.....
            };
            self.validator = $("#post-form").validate({
                rules: {
                    // JQuery Validation Rules
                }
            });
        };
        return PostModel

tag.js

define(['jquery', 'jqueryval', 'knockout', 'kendo', 'kendo-knockout', 'notify'],
    function ($, jqueryval, ko, kendo, ko_kendo, notify) {
        'use strict'

        var TagModel = function () {
            var self = this;

            self.id = ko.observable(0);
            self.name = ko.observable(null);
            self.urlSlug = ko.observable(null);

            self.init = function () {
                //..... this code runs fine (initializes a Kendo Grid)
            };
            self.create = function () {
                //.....
            };
            self.edit = function (id) {
                //.....
            };
            self.remove = function (id) {
                //.....
            };
            self.save = function () {
                //.....
            };
            self.cancel = function () {
                //.....
            };
            self.validator = $("#tag-form").validate({
                rules: {
                    // JQuery Validation Rules
                }
            });
        };
        return TagModel;
    });

category.js

define(['jquery', 'jqueryval', 'knockout', 'kendo', 'kendo-knockout', 'notify'],
    function ($, jqueryval, ko, kendo, ko_kendo, notify) {
        'use strict'

        var CategoryModel = function () {
            var self = this;

            self.id = ko.observable(0);
            self.name = ko.observable(null);
            self.urlSlug = ko.observable(null);

            self.init = function () {
                //..... this code runs fine (initializes a Kendo Grid)
            };
            self.create = function () {
                //.....
            };
            self.edit = function (id) {
                //.....
            };
            self.remove = function (id) {
                //.....
            };
            self.save = function () {
                //.....
            };
            self.cancel = function () {
                //.....
            };
            self.validator = $("#category-form").validate({
                rules: {
                    // JQuery Validation Rules
                }
            });
        };
        return CategoryModel;
    });

备注

每个init()函数都运行正常，因为它们初始化 kendo网格，我可以看到它们正常工作。
当我尝试在其中任何一个上调用create()时，它们会抛出有关字段为空的错误。示例：self.validator is undefined（我在create()内的验证器上调用重置。）
所以我做的是在FireBug中运行以下内容： alert(JSON.stringify(viewModel.postModel)); 这只显示{}，因此我们可以在这里看到一个空对象。

我做了什么

我尝试将所有内容更改为单身，例如：

var CategoryModel = {}

而不是：

var CategoryModel = function () {};

这似乎阻止viewModel.postModel和其他人为空，但它引起了其他问题。主要使用this关键字确定问题并且我无法成功设置var self = this; - 即使我在activate()中执行此操作，它仍然无效 - 我会得到主要信息访问this时查看模型或其他内容。所以我认为我现在设置它的方式是最安全的范围，但由于某种原因，这3个字段总是NULL。

在这一天，我已经把头发撕了好几天了。任何人都可以帮助我吗？

修改

当我在控制台中运行以下内容时：

alert(JSON.stringify(viewModel))

我明白了：

{"postModel":{},"categoryModel":{},"tagModel":{},"__moduleId__":"viewmodels/admin/blog"}

如您所见，3个子模型是空对象，由于某些原因，以下功能也缺失：

self.showCategories = function () { }
self.showPosts = function () { }
self.showTags = function () { }

我对这个想法完全没有了......

Answer 1

好吧，出于某种原因，self.validator始终为NULL。我的 guess 是在将HTML注入Durandal占位符之前正在评估模块。因此，在评估self.validator = $("#post-form").validate({时，页面上不存在ID为#post-form的表单，因此self.validator未定义。

所以我的解决方案是仅在self.validator函数中指定init()，该函数在 Durandal 生命周期的attached回调期间调用。

RequireJS / Durandal字段始终为null

1 个答案: