Question

我目前正在尝试将用户输入传递到我的$ http.get请求中。我正在使用bootstrap和angular但我很困惑，因为我试图通过bootstrap模式传递两个日期。我目前有这样的控制器

app.controller('testCtrl', function($scope, $http){
  $http.get("website" + box1 + box2).then(function(r){
    $scope.Data = r.data;
  });
});

带有

的bootstrap中的模态

<div class="modal-header">
  <h4 class="modal-title">test</h4>
</div>
<div class="modal-body">
  <input id="box1" type="text"/>
  <input id="box2" type="text"/>
</div>
<div class="modal-footer">
  I don't know what to put here to pass it into angular
</div>

Answer 1

使用它：

app.controller('testCtrl', function($scope, $http){
  $scope.box1 = "";
  $scope.box2 = "";
  $http.get("website" + $scope.box1 + $scope.box2).then(function(r){
    $scope.Data = r.data;
  });
});
And a modal in bootstrap with

<div class="modal-header">
  <h4 class="modal-title">test</h4>
</div>
<div class="modal-body">
  <input ng-model="box1" id="box1" type="text"/>
  <input ng-model="box2" id="box2" type="text"/>
</div>
<div class="modal-footer">
  I don't know what to put here to pass it into angular
</div>

Answer 2

在控制器中

app.controller('testCtrl', function($scope, $http){
 $scope.submit = function(){
  $http.get("website" + $scope.box1 + $scope.box2).then(function(r){
    $scope.Data = r.data;
  });
 };
});

在bootstrap模式html中确保此HTML使用testCtrl控制器

<div class="modal-header">
  <h4 class="modal-title">test</h4>
</div>
<div class="modal-body">
  <input ng-model="box1" type="text"/>
  <input ng-model="box2" type="text"/>
</div>
<div class="modal-footer">
  <button ng-click="submit()" class="btn">Submit(or text you want to keep)</button>
</div>

将用户输入传递到$ http.get请求angularJS

2 个答案: