Question

我是棱角分明的

帮助我从 ng-model 中获取价值并将其传递到 $ http params 以获取json 响应，

然后我不知道如何使用我自己的模板显示结果作为ng-repeat

    <script>
    var myApp = angular.module("orderApp", []);
    myApp.controller("ArchiveController", function ($scope, $http) {
        console.log($scope.fromdate);
        console.log($scope.todate);

        $http({
            url: "@Url.Action(MVC.Admin.Finance.ActionNames.OrdersArchiveList,MVC.Admin.Finance.Name)",
            method: "GET",
            params: { fromDate: '1396-01-01', toDate: '1396-01-17' }
// i should use $scope.fromdate & $scope.todate here
        })
        .then(function (response) {
            $scope.orderArchive = response.data;
            console.log(response.data);
        });

    });
    </script>

这是我的HTML代码

<div ng-app="orderApp">
        <div ng-controller="ArchiveController">

            <h2 class="title">بایگانی سفارش‌ها</h2>
            <div class="form-horizontal">
                <div class="form-group">
                    <label class="col-sm-2 control-label" for="txtFromDate">از تاریخ:</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control fromDate" id="txtFromDate" ng-model="fromdate" placeholder="@Persia.Calendar.ConvertToPersian(DateTime.Now).ToString().Replace("/","-")" value="@Persia.Calendar.ConvertToPersian(DateTime.Now).ToString().Replace("/","-")">
                    </div>
                    <label class="col-sm-2 control-label" for="txtToDate">تا تاریخ:</label>
                    <div class="col-sm-4">
                        <input type="text" class="form-control toDate" id="txtToDate" ng-model="todate" placeholder="@Persia.Calendar.ConvertToPersian(DateTime.Now).ToString().Replace("/","-")" value="@Persia.Calendar.ConvertToPersian(DateTime.Now).ToString().Replace("/","-")">
                    </div>
                </div>
                <a class="btn btn-primary btn-block searchInArchive" ng-href="#">جستجو</a>
            </div>
            <hr />

<!-- Template html code: -->
            <div class="results">
                <div class="panel-group" role="tablist" aria-multiselectable="true" data-day="2" ng-repeat="order in OrderArchive">
                    <h3 class="dayName"></h3>
                    <div class="panel panel-default orderItem">
                        <div class="panel-heading" role="tab">
                            <span class="description"></span>
                            <h4 class="panel-title">
                                <a role="button" data-toggle="collapse" data-parent="#day-1" href="#order-{{order.id}}" aria-expanded="true" aria-controls="collapse-one">
                                    فاکتور #{{order.id}}
                                </a>
                            </h4>
                        </div>
                        <div class="panel-collapse collapse in" id="order-{{order.id}}" role="tabpanel" aria-labelledby="orderHeader-{{order.id}}">
                            <div class="panel-body orderInfo">
                                <div class="row borderBottom">
                                    <div class="col-xs-12 col-sm-6">
                                        زمان سفارش: <b>{{order.orderDatetime}}</b>
                                    </div>
                                    <div class="col-xs-12 col-sm-6">
                                        سفارش‌دهنده: <b>{{order.ordererFullName}} — {{order.ordererUserName}}</b>
                                    </div>
                                    <div class="col-xs-12">
                                        آدرس: <b>{{order.ordererAddress}}</b>
                                    </div>
                                </div>
                                <div class="row borderBottom">
                                    <div class="col-xs-12">
                                        سفارش‌ها:
                                        <div ng-repeat="food in order.foods">
                                            <b>
                                                <i class="howMany" data-food="{{food.id}}"> عدد</i>
                                                <span class="foodMenu">{{food.menuName}}</span>
                                                <span data-toggle="tooltip" data-placement="auto" data-html="true" title="" data-original-title="{{food.price}} تومان">{{food.name}}</span>
                                            </b>
                                        </div>
                                        —
                                    </div>
                                </div>
                                <div class="row borderBottom">
                                    <div class="col-xs-12 col-sm-3">
                                        درگاه پذیرنده: <b>{{order.bank}}</b>
                                    </div>
                                    <div class="col-xs-12 col-sm-3">
                                        کد رهگیری تراکنش: <b>{{order.orderReferenceId}}</b>
                                    </div>
                                    <div class="col-xs-12 col-sm-3">
                                        مبلغ: <b class="orderAmount">{{order.orderAmount}}</b>
                                    </div>
                                    <div class="col-xs-12 col-sm-3">
                                        وضعیت سفارش: <b data-toggle="tooltip" data-placement="auto" data-html="true" title="" class="text-success" data-original-title="123">{{order.orderlevel}}</b>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

请帮我找到解决方案。

Answer 1

看起来您没有在控制器内声明变量$scope.formdate和$scope.todate。尝试下面的代码，它首先要做的是声明变量。然后将它们添加到params，您只需要将这些变量放在现在的常量位置，如下所示。

<script>
    var myApp = angular.module("orderApp", []);
    myApp.controller("ArchiveController", function ($scope, $http) {
        $scope.fromdate = "";
        $scope.todate = "";

        $http({
            url: "@Url.Action(MVC.Admin.Finance.ActionNames.OrdersArchiveList,MVC.Admin.Finance.Name)",
            method: "GET",
            params: { fromDate: $scope.fromdate, toDate: $scope.todate}
        })
        .then(function (response) {
            $scope.orderArchive = response.data;
            console.log(response.data);
        });

    });
</script>

Angular如何从ng-model中获取值并传递给params

1 个答案: