fooTable在AngularJS中无法正常工作

Question

我在 AngularJS 中遇到 fooTable 的问题，这就是我正在做的事情：

<table class="table m-b-none" ui-jq="footable" data-filter="#filter" data-page-size="5">
    <thead>
        <tr>
            <th data-toggle="true">Name</th>
            <th data-hide="phone">Logo</th>
            <th data-hide="phone,tablet">Website</th>
            <th data-hide="phone,tablet" data-name="Friendly URL">URL</th>
            <th data-hide="all">External Parameter 1</th>
            <th data-hide="all">External Parameter 2</th>
            <th data-hide="all">Meta Keywords</th>
            <th data-hide="all">Meta Description</th>
            <th data-hide="all">Period</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="store in stores">
            <td>{{store.name}}</td>
            <td><img ng-src="{{store.logo}}" /></td>
            <td>{{store.website}}</td>
            <td>{{store.friendly_url}}</td>
            <td>{{store.external_parameter1}}</td>
            <td>{{store.external_parameter2}}</td>
            <td>{{store.meta_keywords}}</td>
            <td>{{store.meta_description}}</td>
            <td>{{store.period}}</td>
            <td data-value="1">
                <!--Edit Button-->
                <a type="button" class="btn btn-xs btn-default" ui-sref="app.store.edit({editId: store.id})">
                    <i class="fa fa-pencil"></i>
                </a>
                <!--Delete Button-->
                <a type="button" class="btn btn-xs btn-default" ng-click="deleteStore(store.id)">
                    <i class="fa fa-trash"></i>
                </a>
            </td>
        </tr>
    </tbody>
    <tfoot class="hide-if-no-paging">
        <tr>
            <td colspan="10" class="text-center">
                <ul class="pagination"></ul>
            </td>
        </tr>
    </tfoot>
</table>

当我按<{1}} 刷新页面时，输出应该是：

然后点击其他地方F5后返回此页面，现在图片发生了变化：

+ 图标消失了，所有e.g. Add Store都显示了，它们没有得到隐藏，应该是这样。

这是我的控制器：

<td>

我也尝试过使用 app.controller('storesCtrl', ['$scope', '$http', function($scope, $http) { $scope.stores = {}; $http.get("http://MyApiUrl/store.php"). success(function(data){ $scope.stores = data; //$('.table').trigger('footable_redraw'); }); }]); ，但没有运气。

请帮忙，谢谢

Answer 1

我找到了解决方案：

success(function(data){
    $scope.stores = data;
    $timeout(function(){
        $('.table').trigger('footable_redraw');
    }, 100);
});