如何将 NGROUTE 与用于更改视图的单选按钮一起使用

how to use ngroute with radio buttons being used to changed the view

本文关键字:视图 单选按钮 一起 NGROUTE 用于      更新时间:2023-09-26

现在我已经编写了一个代码来使用 ng-route 更改页面的视图。代码是

<a href="#cod">Cash on delivery</a>
<a href="#online">Online Payment</a>
<ng-view>
</ng-view>

js 代码是

myApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/cod', {
        templateUrl: './cod.html',
        controller:'codController'
    }).
      when('/online', {
        templateUrl: './online.html',
        controller:'onlineController'
      }).
      otherwise({
        redirectTo: '/cartdisplay.php'
      });
}]);

它工作正常,视图正在正常更改。但是我需要单选按钮来更改视图,例如

 <a href="#cod">
     <input type="radio" name="pay" id="cod">
     <label for="cod">COD</label>
 </a>
 <a href="#online">
     <input type="radio" name="pay" id="online">
     <label for="online">Online Payment</label>
 </a>
 <ng-view>
 </ng-view>

但现在观点没有改变。 ngRoute 不起作用,解决这个问题的解决方案是什么。

<input type="radio" name="pay" id="cod" ng-model="someVariableOfScope"><label for="cod" data-ng-click="changeRoute('cod')">COD</label>
    <input type="radio" name="pay" id="online" data-ng-click="changeRoute('online')"><label for="online" ng-model="someVariableOfScope ">Online Payment</label>
             <ng-view>
         </ng-view>

在控制器中:

    function SomeCommonController($scope, $location, $rootScope) {
     $scope.changeRoute = function(routeKey) {
       if ( $scope.routeKey == 'cod' ) { // test
            $location.path( "/cod" );
        } else ( $scope.routeKey == 'online' ) { {
                    $location.path( "/online" );
        }
    }