CODEWITHSUNDEEP
angularjsangular-routing
disassemble-number-5
disassemble-number-5

Reputation: 995

In Angular, can view be loaded in code?

Very simply, after an API call, depending on the return value, how is the appropriate view loaded? Consider having

search.html
views/found.html
views/notfound.html

Search's controller makes an AJAX call to a service and gets a good or bad result. Now I want the appropriate view to load, without user having to click. I just can't figure out how to do this and have looked at scores of routing/view examples. I'm using HTML5 mode.

app.config(['$routeProvider', '$locationProvider',
function ($routeProvider, $locationProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'search.html',
            controller: 'searchCtrl'
        })
        .when('found', {
            templateUrl: 'views/found.html',
            controller: 'foundCtrl'
        })
        .when('notFound', {
            templateUrl: 'views/notFound.html',
            controller: 'notFoundCtrl'
        })
        .otherwise({
            templateUrl: 'search.html',
            controller: 'searchCtrl'
        });

    $locationProvider.html5Mode({
        enabled: true,
        requiredBase: true
    });

And in the controller ..

$scope.post = function (requestType, requestData) {
    var uri = 'Search/' + requestType;
    $http.post(uri, requestData)
        .success(function (response) {
            $scope.searchResult.ID = response.ID;
            $scope.searchResult.Value = response.Value;
            // how is the view/route loaded without a user click?
            'found';
            return true;
        }).error(function (error) {
            // how is the view/route loaded without a user click?
            'notFound';
            return false;
        });

I'm just lost after getting back the response on how to invoke a view within the template.

Upvotes: 0

Views: 122

Answers (1)

Aditya Singh
Aditya Singh

Reputation: 16720

Since you are using ngRoute use $location.path() instead of $state.go(). The $location.path() method accepts a url specified in route configuration. E.g.:

$location.path('/found');

Say your controller is AppController, then the complete code will look something like:

angular.module('app', ['ngRoute'])
  .controller('AppController', function ($location, $http) {
     $scope.post = function (requestType, requestData) {
        var uri = 'Search/' + requestType;
        $http.post(uri, requestData)
            .success(function (response) {
                $scope.searchResult.ID = response.ID;
                $scope.searchResult.Value = response.Value;
                // how is the view/route loaded without a user click?
                $location.path('/found');
            }).error(function (error) {
                // how is the view/route loaded without a user click?
                $location.path('/notFound');
            });
   });

Refer https://docs.angularjs.org/api/ng/service/$location for api documentation of $location.path

Upvotes: 1

Related Questions