与MVC4,Breeze和淘汰赛的数据绑定问题

时间:2013-01-08 11:31:37

标签: asp.net-mvc-4 knockout.js breeze

我是knockout.js的新手,我使用MVC4和Breez.js在一个简单的测试页面上遇到错误。我想将数据绑定到表。

@{Layout = null;}
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width" />
        <title>Breeze Test</title>
        <link rel="stylesheet" href="/Content/breezesample.css" />
    </head>
    <body>
        <header>
            <div class="content-wrapper">
                <div class="float-left">
                    <p class="site-title">
                        <a href="~/">Breeze Test</a>
                    </p>
                </div>
            </div>
        </header>
        <div id="body">
            <section id="content" class="content-wrapper main-content">

                <script type="text/x-jquery-tmpl" id="BookTableTemplate">
                    <table>
                        <thead>
                            <tr>
                                <th>Title</th>
                                <th>Author</th>
                                <th>ISBN</th>
                                <th>Price</th>
                                <th>Read?</th>
                            </tr>
                        </thead>
                        <tbody data-bind="template: {name:'bookRowTemplate', foreach:books}">
                        </tbody>
                    </table>
                </script>

                <script type="text/x-jquery-tmpl" id="bookRowTemplate">
                    <tr>
                        <td>${Title}</td>
                        <td>${Author}</td>
                        <td>${ISBN}</td>
                        <td>${Price}</td>
                        <td>${IsRead}</td>
                    </tr>
                </script>

                <div data-bind="visible: show" style="display: none">
                    <a href="#" data-bind="click: save">Save</a>&nbsp;
                        <input type="checkbox" data-bind="checked: IncludeRead" />
                    include read 

                    <div data-bind="template: 'BookTableTemplate'"></div>
                </div>
                <div id="logmessages"></div>
            </section>
        </div>
        <!--3rd party library scripts -->
        <script src="/Scripts/jquery-1.7.1.min.js"></script>
        <script src="/Scripts/knockout-2.1.0.js"></script>
        <script src="/Scripts/q.js"></script>
        <script src="/Scripts/breeze.debug.js"></script>

        <!-- Application scripts -->
        <script src="/Scripts/app/logger.js"></script>
        <script src="/Scripts/app/bookViewModel.js"></script>
    </body>
</html>

而不是获取数据输出我得到: $ {Title} $ {Author} $ {ISBN} $ {Price} $ {IsRead}

1 个答案:

答案 0 :(得分:3)

请看这个例子:http://knockoutjs.com/documentation/template-binding.html

在您的模板中使用&lt; td data-bind =“text:Title”&gt; /&gt;