Переключение представлений в контроллерах AngularJS: методы и примеры

Чтобы переключить представления из функции контроллера в AngularJS, вы можете использовать несколько методов. Вот некоторые из распространенных подходов:

  1. Использование $location.path():
    Вы можете использовать службу $locationдля изменения URL-пути, что, в свою очередь, может вызвать изменение маршрута и переключение видов. Внедрите сервис $locationв свой контроллер и используйте метод path(), чтобы установить новый путь. Например:

    app.controller('MyController', ['$location', function($location) {
     $location.path('/new-view');
    }]);
  2. Использование $state.go():
    Если вы используете AngularUI Router, вы можете использовать сервис $stateдля навигации между состояниями. /Просмотры. Внедрите сервис $stateв свой контроллер и используйте метод go()для перехода в желаемое состояние. Например:

    app.controller('MyController', ['$state', function($state) {
     $state.go('newState');
    }]);
  3. Использование ngRoute:
    Если вы используете встроенный модуль ngRoute, вы можете определять маршруты и использовать $routeProviderдля навигации между представлениями. Внедрите сервис $locationв свой контроллер и используйте метод path(), чтобы изменить URL-адрес, что приведет к изменению маршрута. Например:

    app.controller('MyController', ['$location', function($location) {
     $location.path('/new-view');
    }]);
  4. Использование ng-showили ng-if:
    Вместо переключения между представлениями вы также можете использовать ng-showили ng-ifдля условного отображения или скрытия различных разделов вашего HTML-шаблона на основе переменной контроллера. Например:

    <div ng-show="showView1">View 1 content</div>
    <div ng-show="showView2">View 2 content</div>

    В вашем контроллере:

    app.controller('MyController', function() {
     this.showView1 = true;
     this.showView2 = false;
    });