带有角度 JS 问题的 Bootstrap Datepicker（再次）

Question

我正在尝试创建一个可编辑的网格，其中有一个可编辑的 dateField。只有当单元格被聚焦时，单元格才会显示为可编辑

$scope.gridOptions = {
            data: 'result',
            enableCellSelection: true,
            enableRowSelection: false,
            enableCellEditOnFocus: true,
            multiSelect: false, 
            columnDefs: [
              { field: 'name',      displayName: 'Name',                enableCellEdit: false,  width: 60 },
              { field: 'age',       displayName: 'Age',                 enableCellEdit: false,  width: 60 },
              { field: 'sex',       displayName: 'Sex',                 enableCellEdit: false,  width: 90 },
              { field: 'dob',       displayName: 'DOB',                 width: 150,
                  editableCellTemplate: '<input type="text" datepicker-popup="dd/MM/yyyy" is-open="true" ng-input="COL_FIELD" ng-model="COL_FIELD" datepicker-append-to-body=true />',


              }                                  
            ]
          };

在editableCellTemplate 中，如果我没有使用is-open="true"，则不会弹出。如果我不使用ng-input="COL_FIELD"，则焦点不会从任何单元格中移除。所以，datepicker 没有被隐藏。但是如果我同时使用两者，则不会选择 value。在控制台中，错误显示为Expression 'true' used with directive 'datepickerPopup' is non-assignable!

* 上有很多关于这个的问题。我几乎尝试了所有，但没有成功。

可以做什么？我怎样才能消除错误？请为我提供一个工作的plunker。我无法用 plunker 创建这个问题。

编辑

我想，我无法删除错误。错误还是一样

Expression 'true' used with directive 'datepickerPopup' is non-assignable!

我怎样才能删除它？删除它后，我相信它会起作用。我尝试将它作为范围变量并引用它，但是当我使用 Inspect 元素检查它时，值没有被替换为 true。如果我将它用作变量并连接模板中的值，如 'is-open="' + $scope.dateFormat.opened + '"' ，仍然存在相同的错误。

编辑 2

这个is-open 是做什么用的？在某处我看到它的价值等于true，某处只是opened。在here in * 的示例之一中，它只是opened1 和opened2。这是什么？以及如何使用它？

我已经使用bcombs 技术消除了错误

编辑 3

经过进一步调试，我发现datePicker正在打开（如果我使用bcombs提到的方法）但是它一打开就关闭了。

     $scope.$on('ngGridEventStartCellEdit', function () {
         debugger;
     });

编辑 4 从更多的操纵我得出的结论是 如果使用ng-input，则它会破坏2 路绑定。即如果您更改日期值文本字段，那么它会在 datePicker 中反映出来，但如果您尝试使用 datePicker 更改值，它将不会反映在 textField 中。

如果您删除 ng-input，这 2 路绑定仍然正确，所以它可以工作，但这会导致 ngGridEventEndCellEdit 事件未触发。所以，重点不会迷失。值被选中，datePicker 被关闭（如果改为 enableCellEditOnFocus:true，我使用 enableCellEdit:true），但焦点仍然在 textField..

需要帮助。希望更新有助于解决问题

Answer 1

我不是引导指令或其角度实现方面的专家......但要直接回答如何删除错误的问题：

我相当肯定 is-open 属性不能是原始值。它需要是一个变量，它将保存此特定小部件是否打开的（布尔）状态。在我的代码中，我使用一个对象来为我的所有日​​期选择器保存这些标志，例如：

openDatePickers：{}

然后，在 cellTemplate 字符串中，我给它一个唯一的 id，例如：

' is-open="openDatePickers[\'dob_{{row.entity.name}}\']" '

（请注意，我使用“name”属性来匹配您的示例，但首选唯一 ID）。

根据评论进行编辑：
单元模板可以访问其控制器范围，因此最简单的方法是简单地声明：
$scope.openDatePickers={};

至于它是如何工作的，这在一定程度上取决于您使用的代码库。
我正在使用 angular-ui，在第 1140 行的 ui-bootstrap-tpls-0.8.0.js 中，您可以看到指令管理“is-open”属性的位置。
如果未提供该属性，则该指令在内部使用闭包管理此标志，但当提供该属性时，行为会有所不同。在这两种情况下，赋值的工作方式都很简单：变量（无论是内部闭包，还是您在属性中提供的那个）只是在状态之间切换。

编辑以响应您的调试
就焦点而言：我不使用 ng-input 或 enableCellEditOnFocus。我确实使用：
enableCellSelection：真
...并且我们的客户不希望允许手动编辑该字段，所以我的输入元素有：
ng-readonly="true"

只要您的用例不要求您允许手动编辑输入字段，这应该是解决您的问题的功能性解决方法。