要求js不能與knockout一起工作

Question

我在mvc4中使用require js。

查看

<script data-main="/scripts/about" src="/scripts/require.js" ></script> 
<article> 
<p> 
    Use this area to provide additional information. 
</p> 
</article> 

about.js

require.config({ 

    paths: { 
     page1: '/Scripts/page1', 
     page2: '/Scripts/page2', 
     knockout : '/Scripts/knockout-2.2.0' 
     } 

    }); 

    require(['page1', 'page2','knockout'], function (page1, page2) { 

    var car = new page1.Car(); 
     car.speed(60); 

     var cycle = new page2.Cycle(); 
     cycle.speed(20); 



     console.log(car.speed()); 
    console.log(cycle.speed()); 
    }); 

page1.js

define(function(){ 

    function Car() { 

    var self = this; 
    self.speed = ko.observable(); 

    } 

    }); 

PA GE2

define(function() { 

    function Cycle() { 

    var self = this; 
    self.speed = ko.observable(); 

    } 

    }); 

在控制檯它說Car是不確定的。

更新

define(['knockout'],function(ko){ 

    function Car() { 

    var self = this; 
    self.speed = ko.observable(); 
    return { 
     speed: self.speed() // But don't forget to declare it in the returned object! 
     }; 
    } 

    }); 

我提前做了這兩個1和Page 2

感謝

Answer 1

AFAIK requirejs隔離加載庫到單個文件。在你的頁面1和頁面2中沒有加載淘汰賽，因此ko名稱空間沒有定義，所以ko.observables沒有定義，當你創建新車時，它將是未定義的。爲了解決這個問題，你應該在第1頁加載淘汰賽也PAGE2提供ko命名空間功能參數：

define(['knockout'], function(ko){ 

    function Car() { 

    var self = this; 
    self.speed = ko.observable(); 

    } 

}); 

或使用ko = require('knockout');或加載一個墊片淘汰賽是一個全局命名空間

編輯：

至少你試了一下。所以這裏是後續。

當你做定義時，你可以使用你提供的所有視圖模型和其他的功能。這是requirejs函數，這個函數應該返回一些東西（即你的viewModel）。這樣，您可以在定義的模塊中擁有私有和公共變量和函數。

define(['knockout'], function(ko){ 

    var Car = function() { 
    var self = this; 
    self.speed = ko.observable(); 
    } 

    return Car; 
}); 

該名稱僅適用於該模塊範圍。在你about.js當您導入模塊，你可以決定如何將其稱爲：

//load page1 script and give returned object 
//(this case a constructor) name: createCar 
require(['page1'], function (createCar) { 

    // now create new instance of your Car function: 
    var car = new createCar(); 
    car.speed(60); 

    console.log(car.speed()); 
}); 

Answer 2

你的模塊需要return他們所代表的代碼。例如，您的Car模塊應該是這樣的：

define(function(){  
    function Car() { 
     var self = this; 
     self.speed = ko.observable(); 
    };  
    return Car; 
}); 

該模塊具有當它做代表的東西，無論是一個函數（構造對象），或對象（代表一個單例）。一旦你的模塊被定義，你require它在另一個模塊中使用它。

define(['pathtoCar/relativeToDataMainAttribute/fromRequireScriptTag'], 
function(Car){ 
    var ferrari = new Car(); 
    ... 
}); 

Answer 3

你可以試試這個

define(function() { 

     function Cycle() { 

     var self = this; 
     self.speed = ko.observable(); 

     } 

    ///////////////////ADDD THISSSS NEWWWW LINEEEE////////// 

    return new cycle(); 

    });