淘汰与Durandal绑定

时间:2014-06-11 04:24:48

标签: javascript knockout.js durandal

我正在使用durandal来创建一个Web应用程序。我正在使用knockout将值绑定到来自服务器的页面。我在将knockout observableArray绑定到页面时遇到问题,它有点复杂。

我的observableArray看起来像,

enter image description here

在视图中,

        <ul data-bind="foreach: products">
            <li><span data-bind='text: product' /></li>
        </ul>

没有错误,也没有工作。

js code。

    define(['plugins/http', 'durandal/app', 'knockout'], function (http, app, ko) {
        var system = require('durandal/system');
        var vm = {
            activate: activate,
            attached: viewAttached,
            products: ko.observableArray([])
        };
        return vm;

        function activate() {       
            var that = this;
            var pdts;
            var recs;
            var recipeJson = [];
            http.get('http://***/Umbraco/Api/Products/GetAllProducts').then(function (response) {
                pdts = response;
                http.get('http://***/Umbraco/Api/Recipes/GetAllRecipes').then(function (response1) {
                    recs = response1;
                    $.each(pdts, function (i, item) {
                        var json = [];
                        $.each(recs, function (j, jtem) {
                            if (item.DocumentTypeId == jtem.BelongstoProduct) {                           
                                json.push(jtem);                            
                            }
                        });

                        jsonitem = {}
                        jsonitem["product"] = item.ProductName;
                        jsonitem["recipes"] = json;
                        recipeJson.push(jsonitem);

                    });
                    that.products = recipeJson;
                    return that.products;
                });
            });                                                           
        }

        function viewAttached(view) {
            $("#accordion > li > div").click(function () {
                if (false == $(this).next().is(':visible')) {
                    $('#accordion ul').slideUp(300);
                }
                $(this).next().slideToggle(300);
            });
        }
    });

请帮忙, 感谢。

1 个答案:

答案 0 :(得分:2)

写作时

that.products = recipeJson;

您正在使用普通数组替换observableArray。你应该写

that.products(recipeJson);

相反,或者只是将每个项目直接推送到可观察数组中,而不是通过recipeJson完全通过that.products.push(jsonItem)