knockout 学习使用笔记----绑定map--双向绑定

Posted 2020-09-18 长风傲天

简单的方式，使用 knockout.mapping.js。

1、引入knockout.mapping.js。

2、声明模型

var model = {
    task:null,
    feedbacks:[],
    feedbackPhotos:null
}

3、mapping 绑定 

var viewModel = ko.mapping.fromJS(model);

4、声明绑定

$(function() {
    ko.applyBindings(viewModel);
    initData();
})

5、赋值

viewModel.task(result.data);

6、使用

<div id="form" data-bind="with:task">
        <div id="form-head">
            <div id="form-head-inner">
                <div id="form-title" class="horizontal">
                    <span data-bind="text:taskName+‘【‘+taskId+‘】‘"></span>
                </div>
                <div id="form-action">
                    
                </div>
            </div>
        </div>

<div class="container" data-bind="foreach:feedbacks">
                                    <div class="row">
                                        <div class="col-md-12 col-sm-12">
                                            <div class="section-title">
                                                <h1 class="heading bold" data-bind="html:moment(feedbackPlanTime).format(‘YYYY-MM-DD‘)"></h1>
                                            </div>
                                        </div>
                                    </div>