Question

我在angularjs应用程序中使用bootstrap服务器端数据表，现在我想在每分钟后重新加载该数据表的数据。那我该怎么办呢？我使用以下代码：

HTML：

<table bs-table-control="matterTableControl"  id="matterTableControl"></table>

控制器：

$scope.getMatterTable = (function () {
    $scope.matterTableControl = {
        options : {
            toolbar : "#get",
            url : url,
            dataField : 'rows',
            cache : false,
            sidePagination : 'server',
            pagination : false,
            showExport : false,
            queryParams : queryParams,
            clickToSelect : true,
            onClickRow : onClickRow,
            maintainSelected : true,
            columns : [{
                    field : 'ClientName',
                    title : 'Client',
                    align : 'left',
                    valign : 'bottom',
                    sortable : false
                }, {
                    field : 'Name',
                    title : 'Matter',
                    align : 'left',
                    valign : 'bottom',
                    sortable : false
                }
            ]
        }
    }
});

我试图通过使用以下代码重新加载它，但没有成功：

$interval(function () {
   $scope.getMatterTable();
}.bind(this), 60000);

数据表的文档： http://bootstrap-table.wenzhixin.net.cn/documentation/

实施例： http://issues.wenzhixin.net.cn/bootstrap-table/#integrate/angular

Github数据表代码： https://github.com/wenzhixin/bootstrap-table-examples/tree/master/integrate/angular

Answer 1

Bootstrap数据表有一个适当的方法来刷新表：

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <groupId>com.mutu</groupId>
    <artifactId>spring-primefaces</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <packaging>war</packaging>
    <repositories>
        <repository>
            <id>prime-repo</id>
            <name>PrimeFaces Maven Repository</name>
            <url>http://repository.primefaces.org</url>
            <layout>default</layout>
        </repository>
    </repositories> 
    <dependencies>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-core</artifactId>
            <version>4.1.6.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-web</artifactId>
            <version>4.1.6.RELEASE</version>
        </dependency>       
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-context</artifactId>
            <version>4.1.6.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-context-support</artifactId>
            <version>4.1.6.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-tx</artifactId>
            <version>4.1.6.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-jdbc</artifactId>
            <version>4.1.6.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-test</artifactId>
            <version>4.1.6.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.mybatis</groupId>
            <artifactId>mybatis</artifactId>
            <version>3.3.0</version>
        </dependency>
        <dependency>
            <groupId>org.mybatis</groupId>
            <artifactId>mybatis-spring</artifactId>
            <version>1.2.3</version>
        </dependency>
        <dependency>
            <groupId>org.mybatis.generator</groupId>
            <artifactId>mybatis-generator-maven-plugin</artifactId>
            <version>1.3.2</version>
        </dependency>       
        <dependency>
            <groupId>com.sun.faces</groupId>
            <artifactId>jsf-impl</artifactId>
            <version>2.2.8-02</version>
        </dependency>
        <dependency>
            <groupId>com.sun.faces</groupId>
            <artifactId>jsf-api</artifactId>
            <version>2.2.8-02</version>
        </dependency>
        <dependency>
            <groupId>org.primefaces</groupId>
            <artifactId>primefaces</artifactId>
            <version>5.0</version>
        </dependency>
        <dependency>
            <groupId>org.primefaces.themes</groupId>
            <artifactId>all-themes</artifactId>
            <version>1.0.10</version>
        </dependency>       
        <dependency>
            <groupId>org.primefaces.themes</groupId>
            <artifactId>green-cool</artifactId>
            <version>1.0</version>
        </dependency>       
        <dependency>
            <groupId>org.apache.commons</groupId>
            <artifactId>commons-lang3</artifactId>
            <version>3.4</version>
        </dependency>
        <dependency>
            <groupId>commons-io</groupId>
            <artifactId>commons-io</artifactId>
            <version>2.4</version>
        </dependency>
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.8</version>
        </dependency>
        <dependency>
            <groupId>joda-time</groupId>
            <artifactId>joda-time</artifactId>
            <version>2.8.1</version>
        </dependency>
        <dependency>  
            <groupId>com.zaxxer</groupId>  
            <artifactId>HikariCP</artifactId>  
            <version>2.4.1</version>  
        </dependency>
        <dependency>
            <groupId>commons-fileupload</groupId>
            <artifactId>commons-fileupload</artifactId>
            <version>1.3</version>
        </dependency>
        <dependency>
            <groupId>org.slf4j</groupId>
            <artifactId>slf4j-simple</artifactId>
            <version>1.6.1</version>
        </dependency>       
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>jstl</artifactId>
            <version>1.2</version>
        </dependency>
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <version>3.0.1</version>
        </dependency>
        <dependency>
            <groupId>org.quartz-scheduler</groupId>
            <artifactId>quartz</artifactId>
            <version>2.2.1</version>
        </dependency>
        <dependency>
            <groupId>org.omnifaces</groupId>
            <artifactId>omnifaces</artifactId>
            <version>2.2</version>
        </dependency>
    </dependencies>
</project>

它基本上是这样做的：

angular.element( document.querySelector( '#matterTableControl' ) ).bootstrapTable('refresh');

Example

Answer 2

刷新bootstrap表的data-url的最佳方法是使用refresh方法和

$table.bootstrapTable('refreshOptions', {url: 'new url'});
$table.bootstrapTable('refresh', {url: 'new url'});

如果你没有刷新，那么BootstrapTable仍会使用Old url进行下一次刷新。例如，在启用服务器端时进行分页/排序/搜索。

此外，如果你创建了没有JS的表，那么你可以用这种方式更新URL

$('#tableId').bootstrapTable('refreshOptions', {url: 'new url'});
$('#tableId').bootstrapTable('refresh', {url: 'new url'});

如果需要添加加载程序图标，则应在调用refresh方法之前添加，并使用onLoadSuccess，onLoadError事件删除加载程序图标。

文档：http://bootstrap-table.wenzhixin.net.cn/documentation/#methods

每分钟后重新加载bootstrap数据表？

2 个答案: