小编Nil*_*elm的帖子

我正在与AngularJS合作开展更大的项目.因此,我希望尽可能简化单个表单的工作.由于我们也使用bootstrap,表单中单个输入字段的代码非常冗长,也许就像

<div class="control-group">
  <label class="control-label" for="inputEmail">Email</label>
  <div class="controls">
    <input type="text" id="inputEmail" placeholder="Email">
  </div>
</div>

如果我可以写一个标签,如

<custom-input 
  label="Email" 
  name="inputEmail" 
  placeholder="Email" 
  type="text" 
  ... >
</custom-input>

相反,这将有助于保持代码清洁和工作简单.

为了实现这个目标,我正在开发一个自定义的AngularJS指令.我的指令当前使用类似于上面的bootstrap示例的模板,自动将标签分配给input-tag.此外,该指令的编译器函数将所有属性从自定义输入标记移动到实际输入标记,以便于自定义自定义输入标记.

app.directive('customInput', function() {
    return {
      require: 'ngModel',
      restrict: 'E',
      template: '<div>' + 
                    '<label for="{{ name }}">the label</label>' +
                    '<input id="{{ name }}" ng-model="ngModel" />' +
                '</div>',
      scope: {
              ngModel: '=',
              name: '@name',
          },
      replace: true,
      compile: function (tElement, tAttrs, transclude) {
            var tInput = tElement.find('input');

            // Move the attributed given to 'custom-input'
            // to the …

我有一个 angular.js 应用程序，它应该在做某事时将焦点设置为特定元素（即，将焦点设置为无效的表单字段以让用户更正错误）。

我正在尝试在 angular-e2e 测试中测试这种行为：

it('should set the focus to the invalid field', function() {
  input('email').enter('foo'); // this is not a valid email address
  element(/* submit button */).click(); // try to submit the form

  // How do I do this?
  expect(element(/* email input element */)).toHaveTheFocus();
});

我怎么能期望某个元素（不）有焦点？我已经尝试过 ':focus' 选择器

expect(element('input[id="..."]:focus').count()).toBe(1);

但没有成功（受测试某些元素是否可见的启发）。

为了设置焦点，我使用了如何在输入字段上设置焦点的想法？

我也在为此编写单元测试，最终使用了 DOM focus() 函数的间谍（据我所知，e2e 测试不可能/不希望这样做）。