2013-06-12 42 views
1

當我的視圖和模型被使用durandal的組合綁定語句綁定時,我從breeze和q.js中收到以下錯誤。我單獨寫了一個有問題的視圖,它在我嘗試對它進行組合綁定之前工作得很好,它會拋出這個錯誤。我嘗試將我的實體構造函數中的所有自定義屬性移動到初始值設定項,並推遲對我的計算機的評估,但是沒有做任何事情來阻止錯誤。我不確定哪個框架導致這個問題,或者如果我自己的代碼是。我在我的datacontext中使用了一個延遲的Q承諾,但我評論它排除它,並回到使用標準的回調函數。爲什麼在durandal中通過微風查詢時會出現TypeError?

錯誤:

[Q] Unhandled rejection reasons (should be empty): [TypeError] 
Object [object Object] has no method 'isExpanded' 
TypeError: Object [object Object] has no method 'isExpanded'? at domainModel.<anonymous> (http://myApp/App/viewmodels/categoryTreeView.js?v=1.0.0.0:31:59)? at evaluateImmediate (http://myApp/Scripts/knockout-2.2.1.debug.js:1241:41)? at Object.ko.dependentObservable (http://myApp/Scripts/knockout-2.2.1.debug.js:1318:9)? at dmInitializer (http://myApp/App/viewmodels/categoryTreeView.js?v=1.0.0.0:30:29)? at proto._postInitialize (http://myApp/scripts/breeze.debug.js:2975:13)? at mergeEntity (http://myApp/scripts/breeze.debug.js:12768:39)? at processMeta (http://myApp/scripts/breeze.debug.js:12685:24)? at visitAndMerge (http://myApp/scripts/breeze.debug.js:12665:16)? at http://myApp/scripts/breeze.debug.js:12972:20? at Array.map (native)?From previous event:? at executeQueryCore (http://myApp/scripts/breeze.debug.js:12593:77)? at proto.executeQuery (http://myApp/scripts/breeze.debug.js:11461:23)? at Object.getCategories (http://myApp/App/services/datacontext.js?v=1.0.0.0:51:17)? at viewModel.self.getCategories (http://myApp/App/viewmodels/categoryTreeView.js?v=1.0.0.0:204:17)? at init (http://myApp/App/viewmodels/categoryTreeView.js?v=1.0.0.0:223:18)? at new viewModel (http://myApp/App/viewmodels/categoryTreeView.js?v=1.0.0.0:225:9)? at Object.<anonymous> (http://myApp/App/durandal/composition.js?v=1.0.0.0:317:42) 

categorytreeview.js:

define(["services/datacontext"], function (ctx) { 
    function domainModel() { 
     var self = this; 
     self.isSelected = ko.observable(false); 
     self.isExpanded = ko.observable(false); 

     self.toggleIsExpanded = function() { 
      self.isExpanded(!self.isExpanded()); 
     }; 
     self.toggleIsSelected = function() { 
      self.isSelected(!self.isSelected()); 
     }; 
    } 
    var dmInitializer = function (item) { 
     item.isBranch = ko.computed(function() { 
      return item.Children().length > 0 || item.ParentCategory() == null; 
     }); 
     item.isRoot = ko.computed(function() { 
      return item.ParentCategory() == null; 
     }); 
     item.isVisible = ko.computed(function() { 
      return item.isRoot() || item.ParentCategory().isExpanded(); 
     }, item); 
    }; 

    ctx.metadataStore.registerEntityTypeCtor("Category", domainModel, dmInitializer); 

    function viewModel() { 
     var self = this; 
     self.categories = ko.observableArray(); 

     self.getCategoriesCallback = function (data) { 
      console.log("callback for getCategories"); 
      self.categories(data.results); 
     }; 
     self.getCategories = function() { 
      ctx.getCategories(self.getCategoriesCallback); 
     }; 
     init = function() { 
      self.getCategories(); 
     }; 
     init(); 
    } 
    return viewModel; 
} 

categorytreeview.html

<div id="categoryTreeView"> 
    <script id="recursiveTemplate" type="text/html"> 
    <ul data-bind="visible: isVisible"> 
     <li data-bind="css: { branch: isBranch, leaf: !isBranch(), expanded: isExpanded }"> 
      <div data-bind="click: toggleIsExpanded"></div> 
      <div> 
       <input type="checkbox" data-bind="attr: { id: 'c-' + CategoryId() }, value: CategoryId" /> 
       <label data-bind="text: Name, attr: { for: 'c-' + CategoryId() }"></label> 
      </div> 
     </li> 
     <!-- ko template: { name: 'recursiveTemplate', foreach: Children } --><!-- /ko --> 
    </ul> 
    </script> 
    <div class="css-treeview"> 
     <!-- ko template: { name: 'recursiveTemplate', foreach: categories } --><!-- /ko --> 
     <div id="dialog-buttons"> 
      <input type="button" 
       value="Cancel" class="btn-cancel"> 
      <input type="button" value="Save" class="btn-primary pull-right"> 
     </div> 
    </div> 
</div> 

這是從主查看HTML中,我撰寫了失敗的看法:

<div data-bind="compose: { model: categoryMapModel, activate: true, cacheViews: false }"> 
</div> 

datacontext.js

function getCategories(afterGetCategories) { 
    //var deferred = Q.defer(); 

    var query = breeze.EntityQuery.from("Category") 
     .orderBy("ParentCategoryId, Name") 
     .expand("Children"); 

    manager.executeQuery(query) 
     .then(function (data) { 
      console.log("callback for getCategories"); 
      //deferred.resolve(data); 
      afterGetCategories(data); 
     }) 
     .fail(function (error) { console.log("Error: " + error); }); 

    //return deferred.promise; 
}; 

更新1:

我已經將Q.js列爲問題,這只是堆棧中的最後一個人。如果我將categoryMapModel()賦值爲下面的初始值,那麼一切正常。如果我然後單擊一個用戶界面按鈕,刪除並重新顯示此視圖,再次一切工作正常。如果我也等待並在activate()方法中設置這個變量,那麼durandal再次調用一切正常。

self.categoryMapModel = ko.observable("viewmodels/categoryTreeView"); 

但是,這個變量是在運行時設置的,當用戶點擊一個按鈕時,那就是當我得到錯誤。我所看到的是breeze.js不會將自定義屬性從我的初始化函數追加到特定實體。正如您從下面的日誌記錄中看到名爲「DVD」的類別實體時,它會彈出。由於未知原因,此實體不包含在初始化函數中定義的任何自定義屬性,如isExpanded()isRoot()在所有實體中,這是唯一沒有自定義屬性的實體。在列表中還有其他實體,它們很好。我沒有看到任何邏輯,爲什麼微風在這種情況下會遇到特定實體的問題,但它是。

我在做什麼錯誤/什麼會導致breeze.js忽略初始化函數?

name: Apparel categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: Art categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: Books categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: Electronics categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: Movies categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: root node categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: Blu-ray categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
*name: DVD categoryTreeView.js:269 
*properties: entityAspect, IsDeleted, CategoryId, PictureId, Name, Description, IsPublished, ParentCategoryId, CreatedOn, ParentCategory, Picture, Children, AdvertiserCategories, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: reddisc categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: Animation categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: Accessories categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: test categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: test2 categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: test23 categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
name: test categoryTreeView.js:269 
properties: isSelected, isExpanded, toggleIsExpanded, toggleIsSelected, entityAspect, CreatedOn, CategoryId, PictureId, Name, Description, IsPublished, IsDeleted, ParentCategoryId, Children, Picture, ParentCategory, AdvertiserCategories, isBranch, isRoot, isVisible, path, _$typeName, entityType, _$interceptor, getProperty, setProperty, categoryTreeView.js:270 
rootCategories needed 
[Q] Unhandled rejection reasons (should be empty): [TypeError] 
+0

'categoryMapModel.html'看起來怎麼樣? 'categoryMapModel'返回viewModel,但'isExpanded'只在'domainModel'上定義。 – RainerAtSpirit

+0

我在文章中添加了categorytreeview.html。 – TugboatCaptain

+0

在Durandal視圖中定義淘汰模板將不起作用。有關詳細信息,請參閱https://groups.google.com/forum/#!searchin/durandaljs/knockout$20can$27t/durandaljs/9GqdFNmgo0k/1-72DJamWI0J。 – RainerAtSpirit

回答

0

我終於明白髮生了什麼事!在主視圖中,我有一個微風查詢擴展到Category表,然後我加載另一個視圖(categoryTreeView),這也需要查詢Category表。由於主視圖首先加載,並且在該視圖中沒有調用registerEntityTypeCtorCategory實體微風本質上是緩存來自該第一查詢的任何實體。當我的第二個視圖出現時,即使我在那裏調用registerEntityTypeCtor,它也不會觸發已經從主視圖的查詢中加載的實體。

相關問題