如何在angular2中使用谓词

前端之家收集整理的这篇文章主要介绍了如何在angular2中使用谓词前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用angular2创建了一个登录页面.它有两个输入字段userName和password.登录中有一个按钮.
当我要为该loginComponent编写测试用例时,必须使用谓词来识别按钮.这是我的测试用例.
import { async,ComponentFixture,TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { LoginComponent } from './login.component';


export class LoginComponentTest {
  constructor(public loginComponent: LoginComponent){
    this.loginComponent.logIn('Chathura','1234');

  }
}

describe('LoginComponent',() => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [
        LoginComponent
      ],})
  });

  const fixture = TestBed.createComponent(LoginComponent);

  const button = fixture.query(predicate: Predicate<DebugElement>,scope?: Function) : DebugElement

});

我将通过提供输入值进行测试,然后单击登录按钮并查看接下来会发生什么.

我无法找到正确使用谓词的正确教程.

创建谓词的最简单方法是使用 By个静态方法之一,即css,directive.
const button = fixture.debugElement.query(By.css('.the-button')).nativeElement;

By.css让你传递任何css选择器.查询的结果将是DebugElement,因此如果要与本机DOM元素进行交互,则需要获取nativeElement.

原文链接:https://www.f2er.com/angularjs/141917.html

猜你在找的Angularjs相关文章