Javascript AngularJS：单击选项卡时刷新视图中的数据

我是一个完全的新手，所以请原谅我的无知

我有一个页面，它有三个选项卡（使用角度材质作为选项卡），显示记录列表。每个选项卡必须显示不同的记录（例如，打开选项卡必须显示“打开”状态的记录，关闭选项卡必须显示“关闭”状态的记录，等等）：

这是路由配置：

angular.module("SomeModule",["ngRoute","ngMaterial"])
    .config(function($routeProvider){
        $routeProvider
            .when("/tasks", {
                templateUrl : "js/tasklist/tasklist.partial.html",
                controller : "SomeController as someCtrl"
            })
            .when("/addTask", {
                templateUrl : "js/taskDetails.partial.html",
                controller : "AnotherController as anotherCtrl"
            })
            .otherwise( {
                redirectTo : "/tasks"
            })

    }) ;

最后，这是我的模板：

<div>
    <table style="width:100%">
        <tr>                
            <th>Task Name</th>
            <th>Description</th>
            <th>Type</th>
        </tr>

        <tr ng-repeat="task in tasks">                
            <td ng-bind="task.title"></td>
            <td ng-bind="task.description"></td>
            <td ng-bind="task.type"></td>
        </tr>
    </table>
</div>

任务名称
描述
类型

现在，当我加载页面（/tasks）时，数据在第一个选项卡上加载良好，但在其他两个选项卡上也加载相同的数据，即使我在每个选项卡上选择了

md，函数被正确调用，但数据在页面上不会刷新

有人能帮忙吗？谢谢。
嗨，我刚刚看了一个“角度材质”选项卡演示，并根据您的需要对其进行了修改，下面是

你只需要修改一下

$scope.selectedTab = function(index) {
    // your httpResponsePromise
}

它应该可以工作，只需忽略css部分，它只是从angular material demo复制的代码，您只需要按照我的方式设置html和js

基本上，select上的
md
是在单击时计算的表达式，而不是事件处理程序。因此，您必须在select=“result=selectedTab（）”

上保存

md，然后将
{{result}}
放入模板中。
为什么要在承诺响应处理程序中使用超时？只需添加一个console.log（）在
httpResponsePromise
行之后和for循环的内部/之后，查看是否调用了
showTaskListing
方法，或者是否调用了该方法，然后得到了什么结果。如果方法没有被调用，那么我们需要更改设置方式，如果结果相同，那么需要更改的是您的后端。执行并签入浏览器console@mindparse超时用于使用$scope.apply（）@XavitojCheema调用方法，并且来自后端的数据也正确。我在发布时剥离了console.log，这样代码就不会那么冗长了！非常感谢你！！将函数更改为使用范围使其工作！您的意思是在范围内定义时调用
showTaskListing
，而不是
someCtrl.showTaskListing
使其工作？是的。这是我现在的函数：
$scope.showOpenTasks=function（）{$location.path（'/tasks'）；showTaskListing（'Open'）；}
<div>
    <table style="width:100%">
        <tr>                
            <th>Task Name</th>
            <th>Description</th>
            <th>Type</th>
        </tr>

        <tr ng-repeat="task in tasks">                
            <td ng-bind="task.title"></td>
            <td ng-bind="task.description"></td>
            <td ng-bind="task.type"></td>
        </tr>
    </table>
</div>

$scope.selectedTab = function(index) {
    // your httpResponsePromise
}