angular.js - angular 搜索功能如何处理？

Question

假设我有两个控制器，这两个控制器是兄弟关系
ListController ==> 列表控制器
SearchController ==> 搜索控制器

页面一上来就在列表控制器中 请求数据成功后挂载到 $scope.data 然后在列表视图中应用。

but 我现在要搜索。

搜索控制器中有方法。输入文字点击确认，获取服务端返回的数据。

ok 我现在成功获取到数据了，我怎么把数据应用到 列表控制器 中 来渲染列表视图？

Answer 1

You can use angularjs broadcast, the key code is as follows
ListController

$scope.$on('SearchController.onSearch',function(e,data){
    console.log(data);
});

SearchController

//搜索方法请根据实例情况处理 ，这里只进行获得结果之后的处理
$scope.search = function(){
    var data = [];//搜索到的数据，如果是异步拿到的，请把以后的代码放到回调中
    $scope.$emit('SearchController.onSearch',data);
}

$rootScope top controller handling

$scope.$on('SearchController.onSearch',function(e,data){
    $scope.$broadcast('SearchController.onSearch',data)    
});

That’s it. The core is the use of broadcast

Answer 2

Write a service to save global data. When entering the list page, first determine whether the global data object has data. If there is no data, the original data will be displayed directly. If there is data, it means that the search has been completed, and the search data or other display methods you like will be displayed.

Answer 3

After clicking search, of course you need to re-request the data. Just re-assign the value to your $scope.data= and it will be ok