AngularJS UI-路由器将参数从视图传递到状态解析

Question

我正在尝试在 ui-sref 中传递 params，然后将其访问到 state resolve。

HTML 查看

ui-sref="reservation({check_in: check_in, check_out: check_out})"

我正在尝试将 ui-sref 中的 params 传递给 resolve。

这是我 controller 中的一些代码，当时我还没有使用 resolve。

        $http.get('server/getFilteredRooms.php', {
            params: {
               check_in: data.check_in,
               check_out: data.check_out
            }
        }).then(function(res){

然后我尝试实现 resolve 因为我想在渲染 view 之前等待数据获取。那样的话，我相信，我不会遇到undefined，因为data来自http function还没有返回。

JS (app.js)

.state("reservation", { 
    url: "/reservation",
    templateUrl: "pages/reservation.html",
    controller: "ReservationController",
    resolve : {
      promiseObj : function($http){
        return $http({
          method: 'GET',
          url: 'server/getFilteredRooms.php',
          params: {
            check_in: check_in,
            check_out: check_in
          }
        });
      }
    }
  })

我正在尝试像这样访问我的 PHP 文件。

PHP

$check_in = $_GET['check_in'];
$check_out = $_GET['check_out'];

Answer 1

要在状态的解析中接收这些参数，首先，您需要在状态的配置中声明这些参数。改变state的配置，引入一个params键如下：

.state("reservation", { 
  url: "/reservation",
  templateUrl: "pages/reservation.html",
  controller: "ReservationController",
  params: {
    check_in: null,
    check_out: null
  },
  resolve: ...

然后，修改解析器如下：

promiseObj: function($http, $transition$){
    var params = $transition$.params();

    return $http({
      method: 'GET',
      url: 'server/getFilteredRooms.php',
      params: {
        check_in: params.check_in,
        check_out: params.check_in
      }
    });
 }

这样，您的解析器就知道它应该从 URL 中提取参数值并将其传递给 HTTP 调用。

AngularJS UI-路由器将参数从视图传递到状态解析

AngularJS UI-router pass param from view to state resolve

php

angularjs

angular-ui-router