Question

我正在使用knockout.js 2.1和jquery.flot 0.7。问题我很奇怪，我无法在jsfiddle上重现它。但是，我会尝试解释它（希望这就足够了）。

所以我有容器，我正在应用我的ko视图模型绑定。在该视图模型中，我有ko.observableArray，其中使用'$ .ajax'填充来自服务器的数据。同样在tat容器中我有饼图（如果我没有进行ajax调用或者只是没有使用数据填充ko.observableArray，它可以正常工作）。

饼图：

<div id="asdasdasd111" style="height: 300px; width: 100%;"></div>

<script>
    $(function () {
        var dasdasdasdadsasdata = [
            { label: "Series1", data: 10 },
            { label: "Series2", data: 30 },
            { label: "Series3", data: 90 }
        ];

        $.plot('#asdasdasd111', dasdasdasdadsasdata, {
            series: {
                pie: {
                    show: true
                }
            }
        });
    });
</script>

我创建了函数（传递给ajax的success），理想情况下演示了这个问题（CoffeeScript，请参阅下面编译的javascript）：

    callback = (data1) =>
        alert("chart exists")

        @sections.push(new MyNamespace.MySection({ DisplayName: data1[0] })) 
        @sections.push(new MyNamespace.MySection({ DisplayName: data1[1] }))                 
        alert("chart still exists")

        for test in ["asdasd", "qweqwe"]
            @sections.push(new MyNamespace.MySection({ DisplayName: test }))                
        alert("chart still exists")

        for item in data1
            @sections.push(new MyNamespace.MySection(item))                              
        alert("click Ok to make pie chart disappear =[")

问题是，当我在$.ajax success中使用该回调时，饼图会被清除：

    $.ajax(
        url: "/api/tools/configurationsections"
        success: callback
    )

但是当我像这样使用它时一切都很好：

    callback([1, 4, 5, 8])

    setTimeout( ( => callback([1, 4, 5, 8]) ), 3000 )

当我没有从服务器迭代数据时，我发现ajax调用一切正常 - 所以如果从for

删除最后callback，一切正常

请指出可能导致这个奇怪问题的原因，因为我已经没有任何想法了。

已编译的Javascript：

callback = (function(_this) {
          return function(data1) {
            var item, test, _i, _j, _len, _len1, _ref;
            alert("chart exists");
            _this.sections.push(new MyNamespace.MySection({
              DisplayName: data1[0]
            }));
            _this.sections.push(new MyNamespace.MySection({
              DisplayName: data1[1]
            }));
            alert("chart still exists");
            _ref = ["asdasd", "qweqwe"];
            for (_i = 0, _len = _ref.length; _i < _len; _i++) {
              test = _ref[_i];
              _this.sections.push(new MyNamespace.MySection({
                DisplayName: test
              }));
            }
            alert("chart still exists");
            for (_j = 0, _len1 = data1.length; _j < _len1; _j++) {
              item = data1[_j];
              _this.sections.push(new MyNamespace.MySection(item));
            }
            return alert("click Ok to make pie chart disappear =[");
          };
        })(this);

使用服务器中的数据填充observableArray后，绘制饼图已清除

0 个答案: