定制&样式角度X可编辑弹出输入

时间:2017-01-11 22:11:06

标签: angularjs angular-directive x-editable

我在我的项目中使用角度x可编辑的editable popover。我已经成功地将我的确认按钮的外观更改为.svg我想使用并删除取消按钮:

app.run(function(editableOptions, editableThemes) {
  editableOptions.theme = 'default';
  editableThemes[default].cancelTpl = '';
  editableThemes[default].submitTpl = '<img class="popoverSubmitBtn" 
    src="images/confirmationBtn.svg" ng-click="$form.$submit()">';
});

但是在尝试更改editableThemes[default].inputTpl时遇到问题。似乎inputTpl的更改由于某种原因未被注册。我想要的是在popover中显示的输入框有一个圆形的&#39; x&#39;按钮清除当前输入 WITHIN 输入文本字段。

这实际上是原始x-editable中的默认行为(请参阅Twitter typeahead.js演示中的here)。虽然有一个等效的使用editableOptions.displayClearButton=true,但这会在输入框旁边创建一个完整的按钮,就像确认按钮一样,这不是我想要的。

我的计划是在这里使用一个指令来提供清晰的&#39;按钮并使用editableThemes[default].inputTpl = '<input type="text" reset-directive>';但是,再次看起来像它已经坏了。即使这个公开的问题here也让我相信它永远不会按预期工作。

有没有人对此有任何好运或知道任何可能对我的情况有帮助的解决方法?

另外 - 有点无关但是在造型主题方面,我该如何移动弹出窗口的位置?目前,当我单击文本以激活弹出窗口时,我的光标位于中间位置,但我希望它更高一些,并且在右侧。

1 个答案:

答案 0 :(得分:0)

搞定了。对于那些有类似问题的人:

  • 可以通过安装后xeditable.css目录中的bower_components来控制popover的样式
  • 虽然inputTpl没有按照我预期的方式运作,但我添加了 使用e-*(即e-my-directive)对输入字段的自定义指令没有问题。