Wijmo 5-Flexgrid&；AngularJS-对其他范围内指令使用相同的数据源_Angularjs_Wijmo_Wijgrid

Wijmo 5-Flexgrid&；AngularJS-对其他范围内指令使用相同的数据源

angularjs

Wijmo 5-Flexgrid&；AngularJS-对其他范围内指令使用相同的数据源,angularjs,wijmo,wijgrid,Angularjs,Wijmo,Wijgrid,在Wijimo5和AngularJS中试用新的Flex网格我的应用程序通过HTTP调用加载数据，网格绑定到控制器级对象作为其数据源。如果我只是执行一个标准的Angular HTTP调用并设置对象，那么网格在单击列标题之前不会显示数据比如说： <body ng-controller="LimoController as limo"> <wj-flex-grid items-source="limo.limoData" show-groups="false" >

在Wijimo5和AngularJS中试用新的Flex网格

我的应用程序通过HTTP调用加载数据，网格绑定到控制器级对象作为其数据源。如果我只是执行一个标准的Angular HTTP调用并设置对象，那么网格在单击列标题之前不会显示数据

比如说：

<body  ng-controller="LimoController as limo">
<wj-flex-grid items-source="limo.limoData" show-groups="false" >
        <wj-flex-grid-column
                header="Status"
                binding="booking.status"
                width="*"></wj-flex-grid-column>
        <wj-flex-grid-column
                header="Pickup Date"
                binding="from.date"
                format="d MMMM"
                width="*"></wj-flex-grid-column>
    </wj-flex-grid>

limo.limoData =new wijmo.collections.CollectionView(results);

<ul>
    <li ng-repeat="item in limo.limoData.items">
     {{booking.status}} 
    </li>
  </ul>

我还有一个ng repeat指令，它正在创建一些附加的表单UI，这些表单UI也绑定到相同的数据（这些数据是可编辑的），这与它的标准AngularJS一样工作良好

然后我尝试将results对象更改为CollectionView-如下所示：

<body  ng-controller="LimoController as limo">
<wj-flex-grid items-source="limo.limoData" show-groups="false" >
        <wj-flex-grid-column
                header="Status"
                binding="booking.status"
                width="*"></wj-flex-grid-column>
        <wj-flex-grid-column
                header="Pickup Date"
                binding="from.date"
                format="d MMMM"
                width="*"></wj-flex-grid-column>
    </wj-flex-grid>

limo.limoData =new wijmo.collections.CollectionView(results);

<ul>
    <li ng-repeat="item in limo.limoData.items">
     {{booking.status}} 
    </li>
  </ul>

这修复了网格立即显示数据的问题，但破坏了ng repeat控件

当然，我可以有两个范围对象，一个作为CollectionView，另一个作为标准数据，但我需要ng repeat的可编辑更新反映在网格中，因此理想情况下，它们需要绑定到同一个对象。

您要做的是将ng repeat绑定到CollectionView的“items”属性。下面是一个这样做的例子

您的代码可能如下所示：

<body  ng-controller="LimoController as limo">
<wj-flex-grid items-source="limo.limoData" show-groups="false" >
        <wj-flex-grid-column
                header="Status"
                binding="booking.status"
                width="*"></wj-flex-grid-column>
        <wj-flex-grid-column
                header="Pickup Date"
                binding="from.date"
                format="d MMMM"
                width="*"></wj-flex-grid-column>
    </wj-flex-grid>

limo.limoData =new wijmo.collections.CollectionView(results);

<ul>
    <li ng-repeat="item in limo.limoData.items">
     {{booking.status}} 
    </li>
  </ul>



{{booking.status}

很高兴它能工作。听起来我们可以在我们的文档中使用这个…；）我最初的回答建议使用CollectionView.sourceCollection。我已修改它以推荐CollectionView.items。项目将反映数据的排序/过滤视图，而sourceCollection将是原始数据。