Angularjs api link 中使用的单选按钮值

Question

我想使用单选按钮的值并将其实现到 api link 但由于某些原因它不是 linking。

这是我的代码

JS

myApp.controller('HomeController', ['$scope', '$http',
    function($scope, $http) {

        $scope.formData = {};
        $scope.doIt = function() {
            $scope.targetURL = ('https://api.api/' + $scope.formData + '/us/profile');

            $http.get($scope.targetURL)
                .success(function(results) {
                    $scope.data = results.data;
                });
        };
    }
]);

HTML

<div class="container-fluid">
 <div class="background">
   <div class="transbox">
      <div class="row">
         <div class="col-lg-4">
         </div>
         <div class="col-lg-3">
            <label><input type="radio" name='radio' value="pc" ng-model="formData"><img src="../img/battlenet.png"></label>
            <label><input type="radio" name='radio' value="psn" ng-model="formData"><img src="../img/playstation.png"></label>
         </div>
         <div class="col-lg-5">
         </div>
      </div>
      <div class="row">
         <div class="col-lg-9">
            <input class="form-control" type="text" placeholder="Enter Gamertag">
         </div>
         <div class="col-lg-3">
            <button type="submit" class="btn btn-default" ng-click="doIt()"> Submit </button>
         </div>
      </div>
   </div>
</div>

Answer 1

这很有效fiddle:

myApp.controller('HomeController', ['$scope', '$http',
    function($scope, $http) {

        $scope.formData = {};
        $scope.doIt = function() {
            $scope.targetURL = ('https://api.api/' + $scope.formData + '/us/profile');

            $http.get($scope.targetURL)
                .success(function(results) {
                    $scope.data = results.data;
                });
        };
    }
    ]);

还有你的HTML：

  <div ng-app="myApp">
<div ng-controller="HomeController">
   <div class="container-fluid">
      <div class="background">
         <div class="transbox">
            <div class="row">
               <div class="col-lg-4">
               </div>
               <div class="col-lg-3">
                  <label><input type="radio" name='radio' value="pc" ng-model="formData"><img src="../img/battlenet.png"></label>
                  <label><input type="radio" name='radio' value="psn" ng-model="formData"><img src="../img/playstation.png"></label>
               </div>
               <div class="col-lg-5">
               </div>
            </div>
            <div class="row">
               <div class="col-lg-9">
                  <input class="form-control" type="text" placeholder="Enter Gamertag">
               </div>
               <div class="col-lg-3">
                  <button type="submit" class="btn btn-default" ng-click="doIt()"> Submit </button>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>

我认为您没有调用控制器，至少在您的示例中没有。如果您在 chrome 控制台中检查请求的网络选项卡，您将看到发送了正确的数据：

https://api.api/pc/us/profile
https://api.api/psn/us/profile

Angularjs api link 中使用的单选按钮值

Angularjs radio button value used in api link

fetch

angularjs