Knockout.Js官網學習（text綁定）

前言

text 綁定到DOM元素上，使得該元素顯示的文本值爲你綁定的參數。該綁定在顯示<span>或者<em>上很是有用，可是你能夠用在任何元素上。

簡單綁定

Today's message is: <span data-bind="text: myMessage"></span> 

<script type="text/javascript" src="~/Scripts/knockout-2.3.0.debug.js"></script>   
<script type="text/javascript">    
    var viewModel = {        
        myMessage: ko.observable()     
    };
    viewModel.myMessage("Hello, world!");
    ko.applyBindings(viewModel);
</script>

    KO將參數值會設置在元素的innerText （IE）或textContent（Firefox和其它類似瀏覽器）屬性上。原來的文本將會被覆蓋。

    若是參數是監控屬性observable的，那元素的text文本將根據參數值的變化而更新，若是不是，那元素的text文本將只設置一次而且之後不在更新。

    若是你傳的是否是數字或者字符串（例如一個對象或者數組），那顯示的文本將是yourParameter.toString()的等價內容。

使用函數或者表達式來決定text值

 繼續在上面的ViewModel中添加一個屬性，而且添加一個依賴監控屬性

price: ko.observable(24.95)
    viewModel.priceRating = ko.dependentObservable(
        function () {
         return this.price() > 50 ? "expensive" : "affordable";
        }, viewModel);

添加一個UI頁面元素進行綁定

The item is <span data-bind="text: priceRating"></span> today.

如今，text文本將在「expensive」和「affordable」之間替換，取決於價格怎麼改變。

關於HTML encoding

由於該綁定是設置元素的innerText或textContent （而不是innerHTML），因此它是安全的，沒有HTML或者腳本注入的風險。例如：若是你編寫以下代碼：

viewModel.myMessage("<i>Hello, world!</i>");

 它不會顯示斜體字，而是原樣輸出標籤。若是你須要顯示HTML內容，請參考html綁定.

關於IE 6的白空格whitespace

IE6有個奇怪的問題，若是 span裏有空格的話，它將自動變成一個空的span。若是你想編寫以下的代碼的話，那Knockout將不起任何做用：