这就是我要完成的任务:创建一个包含MatStepper的组件,它将接受2..n步骤,每个步骤都有自己的组件.
话虽如此,我知道如何在其他语言中执行此操作的方式是创建具有公共行为的接口,并在不同的组件中实现它,但在包装器组件中使用接口.
向导step.component.ts
export interface WizardStep {
isValid: boolean;
nextClicked(e);
previousClicked(e);
}
Run Code Online (Sandbox Code Playgroud)
wizard.component.ts
import { Component, Input, OnInit, ViewChild } from '@angular/core';
import { ProgressBarType } from '../progress-bar/ProgressBarType';
import { MatStepper } from '@angular/material';
import { WizardStep } from './wizard-step.component';
@Component({
selector: 'app-wizard',
templateUrl: './wizard.component.html',
styleUrls: [ './wizard.component.css' ]
})
export class WizardComponent implements OnInit {
progress: number;
progressBarType = ProgressBarType.Progress;
@Input() steps: WizardStep[] = [];
/**
* The material stepper instance.
*/
@ViewChild('stepper') private stepper: MatStepper;
constructor() {
} …Run Code Online (Sandbox Code Playgroud) Java 11、Spring Boot 2.1.3、Spring 5.1.5
我有一个 Spring Boot 项目,其中某些端点由 API 密钥保护。目前使用以下代码可以正常工作:
@Component("securityConfig")
@ConfigurationProperties("project.security")
@EnableWebSecurity
@Order(1)
public class SecurityJavaConfig extends WebSecurityConfigurerAdapter {
private static final Logger LOG = LoggerFactory.getLogger(SecurityJavaConfig.class);
private static final String API_KEY_HEADER = "x-api-key";
private String apiKey;
@Override
protected void configure(HttpSecurity httpSecurity) throws Exception {
APIKeyFilter filter = new APIKeyFilter(API_KEY_HEADER);
filter.setAuthenticationManager(authentication -> {
String apiKey = (String) authentication.getPrincipal();
if (this.apiKey != null && !this.apiKey.isEmpty() && this.apiKey.equals(apiKey)) {
authentication.setAuthenticated(true);
return authentication;
} else {
throw new BadCredentialsException("Access Denied.");
}
}); …Run Code Online (Sandbox Code Playgroud) 我在CI环境中运行测试时遇到问题.使用Node v6.0.0/npm 3.8.6,配置在MacOS 10.11.6(El Capitan)上运行正常,但在运行带有Node v4.2.2/npm 2.14.7的Windows的TeamCity 9.1.6代理上,它很糟糕地失败了错误的PhantomJS have not captured in 60000 ms.
这是TeamCity上的示例堆栈跟踪:
[08:58:40][exec] 02 11 2016 08:58:41.095:DEBUG [config]: autoWatch set to false, because of singleRun
[08:58:40][exec] 02 11 2016 08:58:41.102:DEBUG [plugin]: Loading plugin karma-jasmine.
[08:58:40][exec] 02 11 2016 08:58:41.107:DEBUG [plugin]: Loading plugin karma-chrome-launcher.
[08:58:40][exec] 02 11 2016 08:58:41.121:DEBUG [plugin]: Loading plugin karma-firefox-launcher.
[08:58:40][exec] 02 11 2016 08:58:41.128:DEBUG [plugin]: Loading plugin karma-phantomjs-launcher.
[08:58:40][exec] 02 11 2016 08:58:41.263:DEBUG [web-server]: Instantiating middleware
[08:58:41][exec] 02 11 2016 08:58:41.595:INFO [karma]: …Run Code Online (Sandbox Code Playgroud) 我有一个使用FontAwesome图标的Angular 7组件库。
首先,输出ng version:
Package Version
------------------------------------------------------------
@angular-devkit/architect 0.10.7
@angular-devkit/build-angular 0.10.7
@angular-devkit/build-ng-packagr 0.10.7
@angular-devkit/build-optimizer 0.10.7
@angular-devkit/build-webpack 0.10.7
@angular-devkit/core 7.0.7
@angular-devkit/schematics 7.0.7
@angular/cdk 7.1.1
@angular/cli 7.0.7
@angular/compiler-cli 7.0.4
@angular/language-service 7.0.4
@angular/material 7.1.1
@ngtools/json-schema 1.1.0
@ngtools/webpack 7.0.7
@schematics/angular 7.0.7
@schematics/update 0.10.7
ng-packagr 4.4.5
rxjs 6.3.3
typescript 3.1.3
webpack 4.19.1
Run Code Online (Sandbox Code Playgroud)
和相关的花絮package.json:
"@fortawesome/angular-fontawesome": "^0.3.0",
"@fortawesome/fontawesome-svg-core": "^1.2.8",
"@fortawesome/free-regular-svg-icons": "^5.5.0",
"@fortawesome/free-solid-svg-icons": "^5.5.0",
Run Code Online (Sandbox Code Playgroud)
这是我的模块定义:
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
import { faAngleDown } from '@fortawesome/free-solid-svg-icons/faAngleDown';
import …Run Code Online (Sandbox Code Playgroud) angular ×2
angularjs ×1
api-key ×1
java ×1
karma-runner ×1
phantomjs ×1
spring-boot ×1
typescript ×1