如何將knockout viewmodel綁定到動態加載頁面？

我用jquery.load函數動態加載頁面，但加載頁面不綁定到viewModel？如何將knockout viewmodel綁定到動態加載頁面？

app.js

function viewModel(){ 
    var self = this; 
    self.users = ko.observable(); 

    Sammy(function() { 
     this.get("#/users",function() { 
      $.get("/api/users",function(data){ 
       self.users(data); 
      }); 
      $("#content").load("pages/users.html"); 
     }); 
    }).run("#/"); 
} 

ko.applyBindings(new viewModel());

的index.html：

<html> 
    <body> 
     <div id="content"></div> 
     <script src="statics/js/lib/jquery-1.8.2.js"></script> 
     <script src="statics/js/lib/knockout-2.2.0.debug.js"></script> 
     <script src="statics/js/lib/knockout.mapping.js"></script> 
     <script src="statics/js/lib/sammy.js"></script> 
     <script src="statics/js/lib/app.js"></script> 
    </body> 
</html>

頁/ users.html

<ul data-bind="foreach: users"> 
    <li><span data-bind="text: fullName"></span></li> 
</ul>

來源

2012-11-06 oguzh4n

這是因爲在當前頁面的JavaScript有之前那麼新的內容是不知道的jQuery/JavaScript代碼的加載新的內容運行後，我的問題重新申請綁定。對於jQuery看看on（）方法http://api.jquery.com/on/ –

@JayBlanchard jquery on（）可以如何幫助我？ – oguzh4n

你需要閱讀文檔 - 它可能不會幫助你，但它可能會指出你在正確的方向。如果沒有，您可以從這裏開始：https://www.google.com/search?q=binding+javascript+to+dynamically+added+content –

-1

我解決後動態頁面加載

function viewModel(){ 
    var self = this; 
    self.users = ko.observable(); 

    Sammy(function() { 
     this.get("#/users",function() { 
      $.get("/api/users",function(data){ 
       self.users(data); 
      }); 
      $("#content").load("pages/users.html", null, function (response, status, xhr) { 
       if (status != "error") { 
       } 
        ko.applyBindings(self, $(".dynamic-page-content").get(0)); 
       } 
      }); 
     }); 
    }).run("#/"); 
} 

ko.applyBindings(new viewModel());

來源

2012-11-06 15:01:46 oguzh4n

不止一次調用applybindings並不是一個好習慣。 – Ananda

-1這不應該是被接受的答案，applybindings不是被設計成這樣使用的，它在任何情況下都不能正常工作。除非你想在追蹤一些最隱晦和難以發現的錯誤方面測試你的真棒技能，在這種情況下，繼續嘗試這個...並享受由此產生的調試挑戰。 – pilavdzice

-1在回答這個問題時，不止一次地對一個元素（或多個元素）進行綁定的行爲可能不會引發錯誤，但它現在確實存在，我認爲淘汰組的開發者知道他們想要的是什麼你綁定到動態加載的內容。 –

$("#content").load("/pages/users.html", function() { 
    ko.applyBindings(new viewModel()); 
}

應該這樣做......

來源

2012-11-06 14:59:41

如何將knockout viewmodel綁定到動態加載頁面？

回答

相關問題