Question

Im AngularJs新手:)。但是我有3个组件：控制器C1（用于输入搜索输入并单击提交按钮），控制器C2（用于div，它将从SearchService接收结果并显示它）和服务searchService用于发送一些硬编码结果。

这个想法是在提交搜索文本后，我必须提交两次。通过一次提交单击，ui-router的视图将更新为部分页面而不加载结果。第二次单击后，将显示结果。

然后在搜索视图页面上完成下一次搜索，一切正常，只需点击一下即可获得所需数据。

如何修复它：我想改变ui-router视图并通过一次点击获得服务结果？

C1方法代码（提交searchText后启动）

$scope.searchText = function searchText(text) {
    $log.log("Method searchText with text: " + text);        
    //var parametersObject = {searchText: text, results: assetResults}

    $state.go('search');        
    $log.log("SearchInputBoxController: rootScope Broadcasting message: " + text);        

    $rootScope.$broadcast('DoSearch', text);                    

    $log.log("SearchInputBoxController finished");
};

C2方法：事件'DoSearch'的事件处理程序

 $scope.$on('DoSearch', function (event, data) {        
    $scope.asset = searchService.search(data);
    $scope.searchText = data;            
 });

searchService代码：

Application.Services.factory('SearchService', ['SearchServiceResource', '$q',
    function (SearchServiceResource, $q) {
        return {
            search : function (searchText)
            {            
                var result = [
                    {id: 'aaaaa', sn:"1234-1234-1234-1235", name:"DCU_name1", type: "DCU", tags: ["tag1", "tag2"]},
                    {id: 'aaaaa', sn:"1234-1234-1234-1235", name:"DCU_name2", type: "DCU", tags: ["tag1", "tag2"]},
                    {id: 'aaaaa', sn:"1234-1234-1234-1235", name:"NODE_name1", type: "DCU_Node", tags: ["tag1", "tag2"]}                        
                ];
                return result;
            }
        };
}]);

Answer 1

我认为点击两次是因为第一次点击是触发状态变化，然后广播发生，然后发生状态变化。第二次单击，状态不需要更改，当前现在未更改的控制器获得广播。我可以想到几种不同的方法（而且我会避免使用rootcope广播）：

在您的共享服务中，维护一个搜索字符串变量并在您的控制器，监视该服务的变量。
更改路由/状态设置以包含/ search /：searchTerm等参数，并在控制器中查找状态建立的searchTerm变量，并在控制器负载上查看是否提供了searchTerm并触发搜索。 Some more info here

如果您需要任何有关所列想法的帮助或更多细节，请立即与我联系。

AngularJS需要2次点击才能执行搜索操作

1 个答案: