2

我的观点如下（为简洁起见）： 

<ul class="nav nav-tabs nav-stacked">
    <li ng-repeat="i in range">
        <a id="list{{i}}" ng-click="ShowList(i)">
            List Item {{i}}
        </a>
    </li>
</ul>

<ng-switch on="listItemType">
    <div ng-switch-when="1">
        <form-a></form-a>
    </div>
    <div ng-switch-when="2">
        <form-b></form-b>
    </div>
    <div ng-switch-when="3">
        <form-c></form-c>
    </div>
</ng-switch>

<form-a>, <form-b>, <form-c>是加载模板Url并拥有自己的控制器的角度指令。

上述视图的控制器是： 

var listCount;
var listIds = [];
$http.get('/api/lists').
    success(function(data) {
        $scope.lists = data.lists;

        for (listCount = 1; listCount <= $scope.lists.length; listCount++) {
            listIds.push(listCount);
        }

        $scope.range = listIds;
    });
$scope.ShowList = function(listNumber) {
    $scope.listItemType = $scope.lists[listNumber - 1].listType;
};

可以看出，这个控制器使用 $http.get() 获取一些数据。
现在，用于<form-a>发布一些数据的控制器。这将更新上述控制器已获取的相同数据。换句话说，我需要<li>在视图开头的标签中添加一个新条目。

但是，该页面的控制器已经完成了 $http.get() 请求。我如何要求它再次获取数据，以便更新第一个控制器中的列表信息？换句话说，在数据发生变化的情况下，第一个控制器中是否有一个事件处理程序可以用来再次 $http.get() 数据？
由于页面没有刷新或重新加载，控制器，我上面的代码只调用 $http.get() 一次，如果同一页面中指令的控制器更新数据，第一个控制器没有办法更新其数据。

4

1 回答 1

2

您只需将该 $get 调用包装在一个函数中并再次调用它。

我们可能需要了解更多您的工作内容……但请考虑一下：

function ParentCtrl($scope, $http) {
   $scope.foo = [];

   $scope.loadFoo = function () {
       $http.get('/foo/data')
            .success(function(data) {
               $scope.foo = data;
            });
   };

   $scope.loadFoo();
}

function ChildCtrl($scope) {
   $scope.loadFoo(); //still here from Parent scope.
}

但是同样，您确实没有提供足够的信息来回答您的问题，因为由于您使用的是指令，因此如果您隔离了范围，则必须将引用传递给您的 loadFoo() 方法：

app.directive('testDir', function (){
   return {
     restrict: 'E',
     scope: {
       'loadFoo': '&'
     },
     link: function(scope) {
       scope.loadFoo();
     }
   }
});

用作：

<test-dir load-foo="loadFoo()"></test-dir>
于 2013-02-27T19:54:31.463 回答