处理 MEAN 应用程序中的复选框

Handling checkboxes in MEAN application

本文关键字:复选框 应用程序 MEAN 处理      更新时间:2023-09-26

我是 MEAN 堆栈的新手,我一直在尝试保存复选框值数组并尝试从 mongodb 检索它。我已经明确定义了有关使用猫鼬的嵌入式数组的模式,问题是如何在 mongodb 中插入选中的项目。我的表单代码如下所示:

<table class="table">
<tr>
    <th><span>Project Name :</span></th>
    <th><input type="text" ng-model="project.projectName" placeholder="Enter projectname"></th>
</tr>
<tr>
    <th>Base Url:</th>
    <th><input type="text" ng-model="project.baseUrl" placeholder="Enter Base URL"></th>
</tr>
<tr>
    <th>Choose APIs:</th>
</tr>
<tr>
    <th><input type="radio" ng-model="project.api" value="downloading" ng-change="downloadAPI()"><span>Downloading API</span></th>
    <th><input type="radio" ng-model="project.api" value="scraping" ng-change="scrapAPI()"><span>Scraping API</span></th>
    <th><input type="radio" ng-model="project.api" value="comparision" ng-change="compareAPI()"><span>Comparision API</span></th>
    <tbody ng-show = "project.api=='downloading'" ng-hide="!downloading">
<tr>
    <th>Choose Files:</th>
</tr>
<tr>
<th><input type="checkbox" ng-model=project.js><span>Js</span></th>
<th><input type="checkbox" ng-model=project.css> <span>Css</span></th>
<th><input type="checkbox" ng-model=project.images><span>Images</span></th>
<th><input type="checkbox" ng-model=project.fonts><span>Fonts</span></th>
<th><input type="checkbox" ng-model=project.multimedia><span>Multimedia</span></th>
</tr>
</tbody>
<tr>
    <th><input type="checkbox" ng-model="project.run" ng-change="runproject()"><span>Run as soon as project is completed!</span></th>
</tr>
<tr>
    <th>
    <div ng-show="action === 'add'"><span><button class="btn btn-success" ng-click="save()">Add Project</button></span></div>
    <div ng-show="action === 'edit'"><span><button class="btn btn-success" ng-click="modify()">Update</button></span>
    </div>
    </th>
</tr>

控制器一切都很好,我在服务器中的 post 请求如下所示:

//post request
router.post('/',function(req,res,next){
 var files=[];
if(req.body.js != null){
files.push(req.body.js);
}
  if(req.body.css != null){
    files.push(req.body.css);
 }
   if(req.body.images != null){
     files.push(req.body.images);
  }
   if(req.body.fonts != null){
    files.push(req.body.fonts);
   }
   console.log(files);
   var obj= new project(req.body);// new object of the mongoose model
   obj.save(function(err,result){
    if(err){
      console.log(err);
    }
   res.json(result);

});});

有没有其他方法可以在数据库中存储复选框值?我非常感谢您的时间和建议,这对我来说真的意义重大。

当您从前端传递数据时,请使用该方法

ng-click="modify(project)"

数据验证部分也在客户端进行。使用角度所需的能力检查零输入。如果您使用它,则不需要检查数据是否为空。

files.push(req.body)