text bindings，第一個傳參將強制轉換為字符串，假值為""，然后變成目標節點的innerText!

今天的天氣為：

$.require("ready,more/avalon", function(){

var viewModel = {

myMessage: $.observable()

};

$.applyBindings(viewModel);

setTimeout(function(){

viewModel.myMessage("晴轉多云");

},1000)

});

使用computed

這價格

$.require("ready,more/avalon", function(){

var viewModel = {

price: $.observable(24.95)

};

viewModel.priceRating = $.computed(function() {

return this.price() > 50 ? "可以接受" : "承擔不起";

}, viewModel);

$.applyBindings(viewModel);

});

上面例子相當于：

這價格

<script type="text/javascript">

$.require("ready,more/avalon", function(){

var viewModel = {

price: $.observable(24.95)

};

$.applyBindings(viewModel);

});

</script>

最后要注意text的行為：

innerInner與textContent會對標簽進行轉義,如

$.require("ready,more/avalon", function(){

var viewModel = {

myMessage: $.observable("Hello, world!")

};

$.applyBindings(viewModel);

});

一個不斷變化的innerText:

The name is

$.require("ready,more/avalon", function(){

function MyViewModel() {

this.firstName = $.observable('Bob');

this.lastName = $.observable('Smith');

this.fullName = $.computed({

getter: function () {

return this.firstName() + " " + this.lastName();

},

setter: function (value) {

var lastSpacePos = value.lastIndexOf(" ");

if (lastSpacePos > 0) { // Ignore values with no space character

this.firstName(value.substring(0, lastSpacePos));

// Update "firstName"

this.lastName(value.substring(lastSpacePos + 1));

// Update "lastName"

}

},

scope: this

})

}

var viewModel = new MyViewModel

$.applyBindings(viewModel);

setTimeout(function(){

viewModel.firstName("first"); // change

},1000);

setTimeout(function(){

viewModel.lastName("last"); // change

},2000)

setTimeout(function(){

viewModel.fullName("XX YY"); // change

},3000)

});

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的avalon.js 转义html,avalon模块的内建适配器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。