Angular ui-grid,向editableCellTemplate添加自定义消息

时间:2016-10-04 05:03:17

标签: angularjs angular-ui-grid ui-grid

我需要在单元格处于可编辑模式时添加自定义错误消息,基本上我只需要将消息添加到可编辑的html模板中,如下所示

<a href=\'#\' data-toggle=\'tooltip\' data-placement=\'top\' title=\'error!\' ng-show=\'!inputForm.$valid\'>errMsg - {{customMsg}}</a>

我刚刚将customMsg绑定到全局范围仅用于测试目的,但它似乎并没有出现。示例plunker添加到此处,如果您能告诉我我在这里做错了什么,这将是一个很大的帮助

由于

1 个答案:

答案 0 :(得分:1)

您可能想看一下这个答案

https://stackoverflow.com/a/28127498/1585304

当你使用ui-grid时,你实际上是在一个孤立的范围内工作。

这意味着只需在html中键入var的名称,就无法访​​问父作用域。

要访问customMsg变量,您需要使用 grid.appScope 引用父作用域。

您的列定义应该更像这样。

 {
      field: 'company',
      displayName: 'Company',
      enableColumnMenu: false,
      editableCellTemplate: "<div><form name=\"inputForm\">
      <input type=\"INPUT_TYPE\" ng-class=\"'colt' + col.uid\" 
       ui-grid-editor ng-model=\"MODEL_COL_FIELD\"  minlength=3 
       maxlength=10 required><a href=\'#\' data-toggle=\'tooltip\' 
       data-placement=\'top\' title=\'error!\' 
       ng-show=\'!inputForm.$valid\'>errMsg - {{grid.appScope.customMsg}}
       </a></form></div>"
    }

唯一的问题是,由于表格几乎完全被行隐藏,因此很难看到该消息。

希望这有帮助。