Angular ui-grid , 添加自定义消息到 editableCellTemplate
Angular ui-grid , add custom message to editableCellTemplate
当单元格处于可编辑模式时,我需要将自定义错误消息添加到单元格,基本上我只需要将消息添加到可编辑的 html 模板中,如下所示
<a href=\'#\' data-toggle=\'tooltip\' data-placement=\'top\' title=\'error!\' ng-show=\'!inputForm.$valid\'>errMsg - {{customMsg}}</a>
我刚刚将 customMsg 绑定到全局范围只是为了测试目的,但它似乎仍然没有出现。这里添加了示例plunker,如果你能告诉我我在这里做错了什么,那将是一个很大的帮助
谢谢
你可能想看看这个答案
当您使用 ui-grid 时,您实际上是在一个孤立的范围内工作。
这意味着您无法通过在 html.
中键入变量名称来访问父作用域
为了访问您的 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>"
}
唯一的问题是很难看到消息,因为表格几乎完全被行隐藏了。
希望对您有所帮助。
当单元格处于可编辑模式时,我需要将自定义错误消息添加到单元格,基本上我只需要将消息添加到可编辑的 html 模板中,如下所示
<a href=\'#\' data-toggle=\'tooltip\' data-placement=\'top\' title=\'error!\' ng-show=\'!inputForm.$valid\'>errMsg - {{customMsg}}</a>
我刚刚将 customMsg 绑定到全局范围只是为了测试目的,但它似乎仍然没有出现。这里添加了示例plunker,如果你能告诉我我在这里做错了什么,那将是一个很大的帮助
谢谢
你可能想看看这个答案
当您使用 ui-grid 时,您实际上是在一个孤立的范围内工作。
这意味着您无法通过在 html.
中键入变量名称来访问父作用域为了访问您的 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>"
}
唯一的问题是很难看到消息,因为表格几乎完全被行隐藏了。
希望对您有所帮助。