Knockout: 让ViewModel从htm中剥离出去。

在一些Knockout例子中,直接在htm中添加scripts写viewmodel,如何能将让ViewModel从htm中剥离出去呢?从knockout官网上找到了解决方法,如下:

1.knockout.htm

<html>
<head>
    <script type="text/javascript" data-main="init.js" src="require.js"></script>
</head>
<body>
    <p>First name:
        <input data-bind="value: firstName" /></p>
    <p>First name capitalized: <strong data-bind="text: firstNameCaps"></strong></p>
</body>
</html>

2.init.js

require(['knockout-2.1.0', 'appViewModel'], function (ko, appViewModel)
{
    ko.applyBindings(new appViewModel());
});

3.appViewModel.js

define(['knockout-2.1.0'], function (ko) {
    return function appViewModel() {
        this.firstName = ko.observable('Bert');
        this.firstNameCaps = ko.computed(function ()
        {
            return this.firstName().toUpperCase();
        }, this);
    };
});

这样就不必在htm中写一大堆js代码了。

 

 

posted on 2013-11-13 06:41  BobLiu  阅读(588)  评论(0编辑  收藏  举报