我正在使用Angular 2,我有这个代码:
JS,此代码启动模板的employee-variable:
handleEmployee(employee : Employee){
this.employee = employee;
this.employee.startDate = new Date('2005/01/01');
console.log(this.employee);
}
Run Code Online (Sandbox Code Playgroud)
模板:
...
<div>
<label>Start date: </label>
<input [(ngModel)]="employee.startDate" type="date" name="startDate"/>
</div>
<div>
...
Run Code Online (Sandbox Code Playgroud)
其他数据如firstname正确显示.但是到了我得到的日期:
mm/dd/yyyy
Run Code Online (Sandbox Code Playgroud)
在input元素中,应该是一个日期.
我怎样才能做到这一点?
我使用查询参数导航到我的应用中的某个页面.从URL中获取参数后我想删除它,理想情况下我会这样:
let userToken: string;
this.sub = this.router
.routerState
.queryParams
.subscribe(params => {
userToken = params['token'];
params['token'].remove();
});
Run Code Online (Sandbox Code Playgroud)
但显然删除功能不存在.有人有替代方案吗?
在我的app.component.ts中,我有以下ngOnInit函数:
ngOnInit() {
this.sub = this.router.events.subscribe(e => {
if (e instanceof NavigationEnd) {
if (!e.url.includes('login')) {
this.loggedIn = true;
} else {
this.loggedIn = false;
}
}
});
}
Run Code Online (Sandbox Code Playgroud)
目前我正在测试sub是否为null但我想测试100%覆盖率的函数.
我想模拟路由器对象,以便我可以模拟URL,然后测试是否正确设置了this.loggedIn.
我将如何进行模拟此功能?我尝试了但是我不知道如何通过涉及的回调和NavigationEnd来实现这一点.
我正在对一个组件进行单元测试,这就是我所拥有的:
describe('Component: nav', () => {
beforeEach(() => addProviders([
provide(UserService, {useClass: MockUserService}),
NavComponent
]));
it('should have a property \'firstName\' with the value \'Crazypug\'',
async(inject([NavComponent], (component) => {
component.ngOnInit();
expect(component.firstName).toEqual('Crazypug')
}))
);
});
Run Code Online (Sandbox Code Playgroud)
这是ngOnInit函数:
ngOnInit() {
this.userService.getFirstNameCall().subscribe(
data => {this.firstName = data.firstname; });
}
Run Code Online (Sandbox Code Playgroud)
当我运行测试时,我得到:
预期未定义为等于'Crazypug'
我怎样才能让Jasmine等待ngOnInit函数完成?我从很久以前就在SO上找到了一些解决方案(以角度2的方式).他们非常复杂或过时.
我有这个功能我需要测试:
login(): void {
this.userService.setSessionAndDateOnlogin();
this.loginService.getLogin()
.subscribe(
octopusUrl => window.location.href = octopusUrl);
}
Run Code Online (Sandbox Code Playgroud)
我使用window.location.href导航到外部URL.
这是我的测试:
it('login function should call the setSessionAndDateOnLogin function from the userservice and\
subscribe to the getLogin function of the loginService.',
fakeAsync(
inject(
[LoginComponent, LoginService, UserService],
(loginComponent: LoginComponent, loginService: LoginService, userService: UserService) => {
spyOn(userService, 'setSessionAndDateOnlogin');
loginComponent.login();
expect(userService.setSessionAndDateOnlogin).toHaveBeenCalled();
})
)
);
Run Code Online (Sandbox Code Playgroud)
当我运行此测试时,我收到以下错误:
你的一些测试做了整页重装!
所以我试着模仿窗口对象:
import { window } from '@angular/platform-browser/src/facade/browser';
...
class MockWindow {
location: {
href: ''
};
}
...
beforeEach(() => addProviders([
...
{ provide: …
Run Code Online (Sandbox Code Playgroud) 我想将外部 CSS 应用于带有链接标签的 React 组件。但是,当我将该组件包含在另一个项目中时,CSS 也会应用到父项目上,这是正常的。
我怎样才能避免这种情况?我希望将“父 css”应用到组件上,但由于该组件是延迟加载的,因此 css 不会对其执行操作。