专注于王牌编辑
我正在使用ng-grid。 在ng-grid中,我有几个文本框和一个按钮。 通过单击按钮,将打开一个ace编辑器,我可以在其中编辑/添加文本。 但是当我点击按钮时,编辑器上没有焦点(没有光标闪烁),我必须手动点击编辑器才能获得焦点。 这是我的html和js文件代码的一部分
HTML:
使用Javascript:
$scope.loadValueData = function (_editor) { editor = _editor; _editor.getSession().setUseWorker(false); _editor.focus(); };
我希望焦点/光标在ace编辑器上闪烁
我给你的是ng-grid-gridOptionsForProcessor的代码片段
\n\ \n\
\ n \
并且isModal的内容是
$scope.isModal = function (row) { rowObj = row; editor.setValue(row.getProperty('value').toString());
所以可以在isModal中设置焦点
所以你遇到的问题是你希望在模态显示后重点发生。 在显示模态后,您需要将焦点(和gotoLine)置于$ timeout中。 这个解决方案有点像hacky,因为我们只是假设在点击的isModal被触发之后,模态和编辑器会准备好一点。
// make sure you include the $timeout dependency var editor; $scope.loadValueData = function (_editor) { editor = _editor; editor.getSession().setUseWorker(false); editor.setReadOnly(true); }; var enableAndFocusEditor = function() { if (editor) { editor.focus(); var session = editor.getSession(); //Get the number of lines var count = session.getLength(); //Go to end of the last line editor.gotoLine(count, session.getLine(count-1).length); editor.setReadOnly(false); } }; $scope.isModal = function (row) { $scope.rowObj = row; $timeout(enableAndFocusEditor,500); //editor.setValue(row.getProperty('value').toString()); }; $scope.close = function() { $scope.rowObj = null; editor && editor.setReadOnly(true); };
我从这个答案得到了关注焦点的代码。
请参阅示例: http : //plnkr.co/edit/KqgY32?p = preview
我可以看到你正在使用Bootstrap Javascript来打开和关闭模式,所以我给你一个适用于该用例的答案,虽然这在我看来是一种完成它的hacky方式。 正确的方法是使用angular-ui引导程序库,以便在AngularJS控制器中使用更好的api – 然后您可以知道何时实际显示模态。 可以挂钩到Bootstrap的’shown.bs.modal’事件,但为此你必须编写自己的指令。