從角度服務調用角路由加載新的視圖和控制器

我試圖調用通過和角度服務的路由，因爲我使用$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

從角度服務調用角路由加載新的視圖和控制器

回答

相關問題