Query Mean js with form,

Question

晚上好

我想做一个搜索引擎的应用程序在JS MEAN.

我有一个数据库与不同的元素，并希望填写表单，并有不同的视图中所有元素的结果。

我没有试过很多，我读过，但我没有看到任何具体的可以帮助。

如何将搜索参数传递给客户端的控制器，然后传递给控制器服务器，并在不同的视图中获得结果?

约翰尝试按类型、颜色和日期顺序进行搜索。

所有这些数据已经存储在数据库中。

有人可以帮助我与搜索表单，客户端控制器和服务器控制器之间的交易的一个简单的例子吗?

Answer 1

以防你需要答案。我来解释一下。您可以在这里看到代码:

<section ng-controller="BooklistPaginationController" ng-init="init(10)">
....
<div class="row">
<div class="col-xs-12 col-md-12 col-sm-12 col-lg-12">
<div id="filter-panel" class="filter-panel" collapse="searchIsCollapsed">
<div class="panel panel-default">
<div class="panel-body">
<form class="form-inline" role="form">
    <div class="form-group">
    <label class="filter-col" for="pref-search">Texto:</label>
    <input type="text" class="form-control input-sm" id="pref-search" ng-model="text">
    </div><!-- form group [search] -->
    <div class="form-group">
    <label class="filter-col" for="pref-orderby">Orden:</label>
    <select id="pref-orderby" class="form-control" ng-model="order">
    <option ng-repeat="x in optionsOrder" value="{{x.value}}">{{x.text}}</option>
    </select> 
    </div> <!-- form group [order by] --> 
    <div class="form-group">
    <label class="filter-col" for="pref-perpage">Elementos página:</label>
    <select id="pref-perpage" class="form-control" ng-model="itemsPerPage">
    <option ng-repeat="x in optionsItemsPage" value="{{x.value}}">{{x.text}}</option>
    </select> 
    </div> <!-- form group [rows] -->
    <button ng-click="find()" class="btn btn-danger" style="margin-top: 4px;">
    <span class="glyphicon glyphicon-search"></span> Buscar
    </button>
</form>
</div>
</div>
</div>
</div>
</div>        

这是视图。您可以看到表单html标记，并且可以使用顺序和分页按文本进行搜索。我们还需要控制器，您可以看到如何调用服务器来执行搜索。

angular.module('booklists').controller('BooklistPaginationController',     ['$scope', 'Booklists',
function ($scope, Booklists) {
$scope.searchIsCollapsed = true;
$scope.optionsItemsPage = [
    {text : "10", value : "10"},
    {text : "30", value : "30"},
    {text : "50", value : "50"}
];
$scope.optionsOrder = [
    {text : "Descendente", value : "asc"},
    {text : "Ascendente", value : "desc"}
];
$scope.optionsStatus = [
    {text : "Todos", value : ""},
    {text : "Borrador", value : "draft"},
    {text : "Publicado", value : "public"}
];
$scope.init = function(itemsPerPage){
    $scope.pagedItems = [];
    $scope.itemsPerPage = itemsPerPage;
    $scope.currentPage = 1;
    $scope.status = 'public';
    $scope.order = 'desc';
    $scope.find();
};
$scope.pageChanged = function () {
    $scope.find();
};
$scope.find = function () {
    var query = { page:$scope.currentPage,
                  itemsPerPage:$scope.itemsPerPage,
                  order:$scope.order,
                  status:$scope.status,
                  text:$scope.text
                };
    Booklists.query(query, function (data) {
        $scope.pagedItems = data[0].booklists;
        $scope.total = data[0].total;
    });
};
}
]);