从角度服务调用角路由加载新的视图和控制器

我试图调用通过和角度服务的路由，因为我使用$http.post我无法获取调用的路由。我可能会在这一切都错了，所以我希望有人可以提出一个建议，或指向正确的方向。最初我使用控制器进行页面加载，一旦搜索命令被调用，它将带有请求的json对象传递给一个角度服务，角度服务然后调用webAPI将请求传递到其他业务层。这是工作流程的逻辑图。蓝色响应是一个新的数据对象，用户搜索结果返回到用户界面。从角度服务调用角路由加载新的视图和控制器

从我的应用程序，我有以下的路线设置

(function() { 

    app = angular.module('app', ['ui.bootstrap', 'ngRoute', 'ngAnimate']).value('ngToastr', toastr); 

    function router($routeProvider) { 
      $routeProvider. 
      when('/search/query', { 
       templateUrl: '../../AngularTemplates/searchResults.html', 
       controller: 'searchResultCtrl' 
      }). 
      otherwise({ 
       templateUrl: '../../AngularTemplates/splashPage.html' 
      }); 
    } 

    app.config(['$routeProvider', router]); 

    //added toaster as factory so it can be injected into any controller 
    angular.module('app').factory('ngNotifier', function (ngToastr) { 
     return { 
      notify: function (msg) { 
       ngToastr.success(msg); 
      }, 
      notifyError: function (msg) { 
       ngToastr.error(msg); 
      }, 
      notifyInfo: function (msg) { 
       ngToastr.info(msg); 
      } 
     } 
    }); 



})();

初始页面调用其中有一个服务依赖

app.controller('searchController', ['$scope', '$filter', 'searchService', 'ngNotifier', '$log', '$timeout', 'searchAttributes' , function ($scope, $filter, searchService, ngNotifier, $log, $timeout, searchAttributes) { 

    var vm = this; 
    vm.search = search; 
    vm.updateEntities = updateEntitySelection; 

    //bootstraped data from MVC 
    $scope.userOptions = searchAttributes.mvcData; 

    //scoped variables 
    $scope.searchTerm = null; 

    //ui container for search response 
    $scope.searchResponse; 

    $scope.entityList = [ 
     'Search All ', 
     'Search in Departments ', 
     'Search in Automotive ' 
    ] 

    $scope.selectedEntity = 'Search All'; 

    function buildSearchRequest() { 
     var searchResponse = { 
      searchTerm: $scope.searchTerm, 
      pageSize: 10,//this will be set by configuration from the UI 
      pagesReturned: 0, 
      entityFilter: $scope.selectedEntity 
    }; 
     return searchResponse; 
    } 

    function onError(msg) { 
     $log.error('An error has occured: ' + msg.data); 
    } 

    function updateEntitySelection(entityName) { 
     $scope.selectedEntity = entityName; 
    } 

    function search() { 
     var request = buildSearchRequest(); 
     searchService.search(request); 
    } 

}]);

和搜索服务控制器

app.factory('searchService', ['$http', function($http) { 

    var myEsResults; 

    function getSearchResults(searchRequest) { 
     return $http.post('search/query', searchRequest, {}).then(function (response) { 

     myEsResults = response.data}); 
    } 

    var getResults = function() { 
     return myEsResults; 
    }; 

    return{ 
     search: getSearchResults, 
     getResults: getResults 
    }; 
}]);

我试图完成的是当文档加载启动画面时（显示工作）。当搜索执行时，请求被传递给webapi，然后响应作为objectback返回到视图和一个新的控制器，以便它可以呈现搜索结果。我在过去的控制器之间来回传递数据，但是我卡住的地方是使用角度服务在webapi中调用路由。进行此调用不会更新页面URL，因此不会调用路由，也不会加载第二个控制器来显示结果。在过去，我使用url来调用角路由，但在这种情况下，我使用的输入按钮是ng-click。我将不胜感激任何有关数据返回如何获得'结果视图'和控制器加载的建议。路由是否正确，或者在使用角度服务时有另一种方法来加载视图和控制器？

在此先感谢

<button type="button" class="btn btn-primary btn-lg" ng-click="vm.search()"><span class="glyphicon glyphicon-search"></span></button>

来源

2015-10-20 rlcrews

应该能够使用$location.path('/search/query')

function getSearchResults(searchRequest) { 
    return $http.post('search/query', searchRequest, {}).then(function (response) { 

     myEsResults = response.data; 
     $location.path('/search/query'); 
    }); 
}

但是工作流程似乎将更有意义添加去做，要么routeParams的网址或搜索查询参数并将url编码的查询条件传递给url并根据该请求提出请求。然后，请求将由searchResultCtrl控制器或resolve在路由器配置中完成。

喜欢的东西：

$location.path('/search/query/' + encodeURIComponent($scope.searchTerm));

：

$routeProvider. 
     when('/search/query/:queryterm', { 
      templateUrl: '../../AngularTemplates/searchResults.html', 
      controller: 'searchResultCtrl' 
     }).

和路径将被生成

来源

2015-10-20 22:05:23 charlietfl

从角度服务调用角路由加载新的视图和控制器

回答

相关问题