如何将$ watchCollection应用于使用ng-include在另一个页面中包含的模板(html页面)中的网格?

时间:2016-04-19 06:59:29

标签: javascript html arrays angularjs

我是angularJS的新手。

我有一个页面,其中包含一个充满数据的网格。

<table items="personList" tr-ng-grid page-items="9"
   selection-mode="SingleRow" selected-items="personGrid"
   style="font-size: smaller;">
<thead>
<tr>
    <th field-name="Name" display-name="{{ 'settings_grid_name' | translate }}"></th>
    <th field-name="address" display-name="{{ 'settings_grid_address' | translate }}"></th>
    <th field-name="age" display-name="{{ 'settings_grid_age' | translate }}"></th>
</tr>
</thead>
<tbody>
    <tr>
        <td field-name="age">
            <div class="text-center">
                <i style="font-size: 21px" class="base-icon {{getDeviceState(gridItem.age)}}"></i>
            </div>
        </td>
        <td field-name="address">
            <div class="text-center">
                <i style="font-size: 21px" ng-style="getDeviceColor(gridItem.Id, gridItem.Status)" class="base-icon {{getDeviceIconType(gridItem.address)}}"></i>
            </div>
        </td>
    </tr>
</tbody>

控制器代码

$scope.$watchCollection('personGrid', function (newVal, oldVal) {

            console.log('Working -- New value');
            console.log(newVal);


        });

我在控制器中应用了$ watchCollection,当我选择任何一行时,它会触发$ watchCollection事件并且一切正常。

我在另一个新的hmtl页面中使用了上述模板。

 <div class="col-lg-2 col-md-2">
    <div ng-include="'settingsModule/views/settingsModuleVehicleGrid.tpl.html'"></div>
</div>

控制器中的代码用于新的html页面。

 $scope.$parent.$watchCollection('personGrid', function (newVal, oldVal) {

            console.log('Working --');
            console.log(newVal);
        });

但是只有在第一次加载页面时才会触发它们。之后,当我选择表格中的任何行时,不会触发该事件。 :(

任何帮助,一些更好的解决方案。也许我们可以在$ rootScope中添加数据并应用$ watch。

0 个答案:

没有答案