access viewModel function in javascript function-knockout

Question

У вас возникли проблемы с методами доступа, определенными внутри модели представления.

Ниже приведен вид модель определение:

ProductMenu = function (name, subProductsMenu1, selectedMenu) { 
    name = ko.observable(name); 
    submenu = ko.observableArray(subProductsMenu1); 
    selectedProductName = ko.observable(); 
}; 
ProductSubMenu = function() { 
    submenuName = ko.observable(); 
    submenu2 = ko.observableArray([]); 
    selectedSubMenuName = ko.observable(); 
}; 
ProductSubMenu2 = function() { 
    submenu2Name = ko.observable(); 
    properties = ko.observableArray([]); 
    selectedSubMenu2Name = ko.observable(); 
}; 
Properties = function() { 
    productName = ko.observable(); 
    shortDesc = ko.observable(); 
    longDesc = ko.observable(); 
    additionalDocs = ko.observableArray([]); 
}; 
var MainViewModel = function() { 
    productModel = new ProductMenu(); 
    subMenuModel = new ProductSubMenu(); 
    submenu2Model = new ProductSubMenu2(); 
    propertyModel = new Properties(); 
    AllProductsModel = ko.observableArray([]); 

    ReturnToFamilyProduct = ko.observable(true); 
    ShowSubMenu = ko.observable(false); 
    showSubMenu2 = ko.observable(false); 
    ShowBackBtnOnSubMenuClick = ko.observable(false); 
    IfDocumentsPresent = ko.observable(true); 

    //to add product to products array 
    AddProducts = function (name, subProductsMenu1, selectedMenu) { 
     this.AllProductsModel.push(new ProductMenu(name, subProductsMenu1, selectedMenu)); 
    }; 
}; 

В $ (документ) .ready функции Я пытаюсь получить доступ к методам вида модели, код приведен ниже:

var VM; 

    $(document).ready(function() { 
     VM = new MainViewModel(); 
     ko.applyBindings(VM); 

     FetchProductFamiliesForProductsKO(); 
    }); 
    function FetchProductFamiliesForProductsKO() { 

     $.getJSON(GetPath('/FetchProduct'), {}, function (data) { 
      for (var i = 0; i < data.length; i = i + 1) { 
       var family = data[i]; 
       VM.AddProducts(family, null, family); 
      } 
     }).error(function() { 
      console.log("Error occured"); 
     });enter code here 
    }; 

I получить ошибку в функции «FetchProductFamiliesForProductsKO»: uncaught typeerror: object [object object] не имеет метода «AddProducts».

Как получить доступ к методам MainViewModel? правильны ли определения модели View? и как инициализировать MainViewModel?

Заранее спасибо.

Answer 1

Проблема здесь в том, как вы определяете свой ViewModel. Вы определяете свойства и функции, не присоединяя их к экземпляру созданного объекта, поэтому JS не видят функцию AddProducts.

вы должны определить ваш ViewModel так:

function MainViewModel() { 
    self = this; 
    self.productModel = new ProductMenu(); 
    self.subMenuModel = new ProductSubMenu(); 
    self.submenu2Model = new ProductSubMenu2(); 
    self.propertyModel = new Properties(); 
    self.AllProductsModel = ko.observableArray([]); 

    self.ReturnToFamilyProduct = ko.observable(true); 
    self.ShowSubMenu = ko.observable(false); 
    self.showSubMenu2 = ko.observable(false); 
    self.ShowBackBtnOnSubMenuClick = ko.observable(false); 
    self.IfDocumentsPresent = ko.observable(true); 

    //to add product to products array 
    self.AddProducts = function (name, subProductsMenu1, selectedMenu) { 
     self.AllProductsModel.push(new ProductMenu(name, subProductsMenu1, selectedMenu)); 
    }; 
} 

уведомление переменной self, которые относятся к экземпляру вашего созданного объекта

любезно проверить эту демку и смотреть консоль без ошибок jsfiddle demo