Question

我正在尝试使select元素在从主页面打开的模态窗口中工作。以下代码有助于理解确切的情况：

home.html做为 {................ ...........

  <div class="pull-right">
    <button type="button" class="btn btn-primary btn-with-text" ng-click="addModalOpen = true">
    <span class="glyphicon glyphicon-plus"></span> Add New Item
    </button>
  </div>
...............
...............
  <div ng-controller="mrsri.controller.AddCtrl"
       class="modal fade"
       ng-class="{'in' : addModalOpen}"
       ng-include="'resources/mrsri/views/createNewRI.html'">
  </div>
............

}

createNewRI.html

{

.............
<div class="modal-dialog">
 <div class="modal-content">
  <div class="modal-header"></div>
  <div class="modal-body">
    <form name="createRIForm" class="form-horizontal">
      <div class="form-group">
       <label class="col-sm-4 control-label">Class Code</label>
       <div class="ri-col-sm-6">
         <select name="classCode" class="form-control" required ng-model="inventory.classCode" ng-options="item.className for item in CCs">
         <option value="">Select a CC..</option>
         </select>
      </div>
....................
....................
    </form>

}

addctrl.js

{

angular.module('mrsri.controller').controller({'mrsri.controller.AddCtrl' :
  [ '$scope', 'mrsri.service.ClassCodeService', 'mrsri.service.LocationService', 'mrsri.service.InventoryService',
         function($scope, ClassCodeService, LocationService, InventoryService) {

     $scope.inventory = {};
     $scope.selectedClassCode = {};

.............
.............
     ClassCodeService.getAllCCs(function(data) {
          $scope.CCs = data;
     });

     $scope.addInventory = function(inventory) {
        $scope.inventory.classCode = $scope.selectedClassCode.classCode; //this does not work at all. While debugging in the developer tools and typing either of the above expressions returns 'undefined'
     InventoryService.addInventory($scope.Inventory, function(data) {
     });
....................

}

在主页 - home.html中，如果用户点击“添加新项”按钮，则会打开一个模态窗口（createNewRI.html - 其控制器为AddCtrl.js）。模态窗口有一个巨大的形式供用户填写，然后最后单击模态窗口上的“保存”按钮应该将详细信息保存到数据库中。上面的代码有几点我不清楚。我只用了一周的Angular JS。

在createNewRI模板中 - 我填充选项的方式有什么问题吗？我尝试了多种方法，例如：使用“item.classCode作为CCs中项目的item.className”或“通过item.classCode跟踪CC中项目的item.className”等。尝试这些选项，以便每当我从中选择一个选项时下拉，我可以在我的控制器中获取该选项的值，然后我可以将该值传递给我的服务。
在AddCtrl.js中：在这个控制器中，我在上面的代码中添加了我的评论。我尝试了许多不同的方法来获得价值，但它没有用。只是在这里添加，我在这个表单上有很多其他字段，我能够获取所有其他字段的值，因为它们不是下拉列表，但问题只在于下拉列表。

有人可以帮我解决这个问题吗？或者，如果我的问题不够明确，请告诉我？

Angular JS：选择元素在模态窗口中不起作用

0 个答案: