Question

现在我已经编写了一个代码来使用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不工作，解决这个问题的解决方案是什么。

Answer 1

<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" );
        }
    }

如何使用带有单选按钮的ngroute来改变视图

1 个答案: