小编inf*_*dev的帖子

如何在 Angular 中将 mat-list-item 包装在 mat-button 中

我有一个列表,我希望列表中的每个元素都可以单击,并具有像垫按钮组件一样的连锁反应。

我试过这个:

<mat-list role="list" *ngFor="let userS of Projet?.backlog.userStory; let i=index">
    <button mat-button>
        <mat-list-item role="listitem">User Story #{{i}} : {{userS.userStory}} </mat-list-item>
    </button>
</mat-list>
Run Code Online (Sandbox Code Playgroud)

但我认为工作元素不可点击。

javascript angular-material angular-material2 angular

5
推荐指数
1
解决办法
9261
查看次数

更改 p-inputSwitch 标签和样式

我会改变Primeng库的p-inputSwitch组件的样式

我会得到这样的东西:

预期设计

这是我的代码:

<div class="contner">
    <div class="toggle-area">
        <p>SEARCH BY</p>
        <div >
        <p class ="toggle-inline">Business group</p>
        <div class="toggle-btn toggle-inline">
            <p-inputSwitch [(ngModel)]="checked"
            onLabel=""
            offLabel=""
            styleClass="ui-inputswitch"
            ></p-inputSwitch>
        </div>
        <p class="toggle-inline">Borrower</p>
        </div>
</div>
Run Code Online (Sandbox Code Playgroud)

我从删除标签开始,但宽度也发生了变化,我不知道如何增加它

我拥有的

html css primeng angular

5
推荐指数
1
解决办法
8978
查看次数

在 ChartJS 和 Angular 上进行水平滚动时使 y 轴粘性

我想在水平滚动时修复 y 轴位置。

这是一个可以工作但不使用 Angular 的示例

$(document).ready(function () {

    function generateLabels() {
        var chartLabels = [];
        for (x = 0; x < 100; x++) {
            chartLabels.push("Label" + x);
        }
        return chartLabels;
    }

    function generateData() {
        var chartData = [];
        for (x = 0; x < 100; x++) {
            chartData.push(Math.floor((Math.random() * 100) + 1));
        }
        return chartData;
    }

    function addData(numData, chart) {
        for (var i = 0; i < numData; i++) {
            chart.data.datasets[0].data.push(Math.random() * 100);
            chart.data.labels.push("Label" + i);
            var newwidth = …
Run Code Online (Sandbox Code Playgroud)

html javascript chart.js angular chartjs-2.6.0

5
推荐指数
1
解决办法
3650
查看次数

未聚焦时更新团队自定义选项卡

实际上,我正在开发一个需要通过网络套接字更新的自定义选项卡。

问题在于,当用户更改选项卡或应用程序(例如退出自定义选项卡应用程序以在团队中使用聊天功能)时,应用程序会被“杀死”,并且它不会使用 Web 套接字拦截从服务器发出的数据,然后更新视图。

我的用例是在服务器推送数据时更新视图,即使选项卡未聚焦。

有没有办法做到这一点 ?

javascript microsoft-teams

5
推荐指数
1
解决办法
195
查看次数

选择时的角度自动完成获取所选值的所有对象

我有一个自动完成组件。

我传递了一个对象数组。

我希望当我选择一个选项时我会得到所有项目信息 ( option) 而不仅仅是字段值 ( option.name)

<form class="example-form">
    <mat-form-field class="example-full-width">
        <input type="text" placeholder="Pick one" aria-label="Number" matInput [formControl]="myControl"
            [matAutocomplete]="auto">
        <mat-autocomplete #auto="matAutocomplete" (optionSelected)='selectOption($event.option)'>
            <mat-option *ngFor="let option of filteredOptions | async" [value]="option.name">
                {{option.name}}
            </mat-option>
        </mat-autocomplete>
    </mat-form-field>
    <router-outlet></router-outlet>
</form>
Run Code Online (Sandbox Code Playgroud)

组件ts

export class SearchLeagueComponent implements OnInit {
  constructor(private searchLeagueService: SearchLeagueService) { }
  myControl = new FormControl();
  options: ILeague[] = [
    {
      _id: '',
      teams: [],
      name: '',
      sport: ''
    }
  ];
  filteredOptions: Observable<ILeague[]> | undefined

  ngOnInit() {
    this.searchLeagueService.getLeaguesList().toPromise().then(data => this.options = …
Run Code Online (Sandbox Code Playgroud)

javascript typescript angular-material2 angular

5
推荐指数
1
解决办法
1万
查看次数

GoJS 中的动画图标

我有一个包含图标的节点图:

$(go.TextBlock, {
  font: '18pt Material Icons', alignment: go.Spot.LeftCenter, stroke: '#FFFFFF',
  margin: new go.Margin(0, 5, 0, -34),
},
  new go.Binding('text', 'statusIcon')),
Run Code Online (Sandbox Code Playgroud)

我想无限地旋转 statusIcon,但前提是statusIcon匹配一个值。

我已经看过如何添加这样的 css 规则。

font: '18pt Material Icons', alignment: go.Spot.LeftCenter, stroke: '#FFFFFF',      
margin: new go.Margin(0, 5, 0, -34),animation:'spin 4s linear infinite';
Run Code Online (Sandbox Code Playgroud)

但我收到一个错误

试图在对象上设置未定义的属性“动画”:TextBlock

我想只有少数 css 规则被 gojs 接受TextBlock

如何仅向节点子元素添加动画?

javascript gojs

5
推荐指数
0
解决办法
125
查看次数

从 Angular 中的 get Http 请求中获取标头

我正在调用一个获取 blob 数据的 API。

后端也向我发送标题中的文件名。

我的实际问题是我无法从 api 获取标题。

这是我的service.ts

public openFile(path) {
  let url='/download/';
  let pathFile= new HttpParams().set('pathFile', path);
  return this.httpClient.get(url,{params:pathFile, responseType: 'blob' });
Run Code Online (Sandbox Code Playgroud)

component.ts 中,我调用了该服务。当我尝试打印时,res.headers我在控制台中未定义。

openFile(path){
  this.creditPoliciesService.openFile(path).toPromise().then (data => {
    console.log("dataaaaaa",data.headers); // undefined
    var blob = new Blob([data], {type: 'application/pdf'}); 
    if (window.navigator && window.navigator.msSaveOrOpenBlob) {
      window.navigator.msSaveOrOpenBlob(blob);
    }
    else {
      var fileURL = URL.createObjectURL(blob); 
      window.open(fileURL);
    }
  });
}
Run Code Online (Sandbox Code Playgroud)

在开发工具管理员中,我在响应标头中获得信息,但我无法在响应变量中找到它们。

httprequest http-headers typescript angular-services angular

4
推荐指数
1
解决办法
1万
查看次数

Angular 路由器:忽略路径参数中的斜杠

我有动态路由,参数中可能包含斜杠或反斜杠,例如:

http://localhost:4200/dashboard/T64/27D 我应该导航到带有路线的页面 T64/27D

这是我如何导航 this.router.navigate(['dashboard/'+this.groupListPage[0].code]); this.groupList[0].code包含T64/27D

实际上 Angular 是分开的,T64并且27D是 2 个不同的页面。

这是错误:

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'dashboard/T64/27D'
Error: Cannot match any routes. URL Segment: 'dashboard/T64/27D'
Run Code Online (Sandbox Code Playgroud)

我怎么能告诉 Angular 那/是 param 的一部分?

url routing typescript angular angular-router

4
推荐指数
2
解决办法
4443
查看次数

在NestJS中设置参数

我正在启动NestJS(强大的框架!)

我将使我的route Query参数成为必需,否则将引发错误400。

@Controller('')
export class AppController {
  constructor() {}
  @Get('/businessdata/messages')
  public async getAllMessages(
    @Query('startDate', ValidateDate) startDate: string,
    @Query('endDate', ValidateDate) endDate: string,
  ): Promise<string> {
   ...
  }
}
Run Code Online (Sandbox Code Playgroud)

我正在使用管道来确定参数是否有效,但不能确定该参数是否存在,而且我不确定是否为此而设计了管道。

那么,如果没有抛出错误,我该如何检查NestJS是否存在我的参数?

javascript node.js express typescript nestjs

4
推荐指数
2
解决办法
2819
查看次数

无需订阅即可获取 ngrx 选择器的当前值

我的 ngrx 状态是这样的

state.data state.dataArchived

我想将数据从 store.data 复制到 state.dataArchived。

selectedSchedulingsOnPopup$ = this.store.pipe(select(selectSchedulingsByBranch));
ngOnInit() {
  this.store.dispatch(new GetDirectionsOnGraph({}));
  this.selectedSchedulingsOnPopup$.subscribe(value => {
    this.selectedSchedulingsOnPopupValue = value;
    this.store.dispatch(new GetDirectionsOnGraph(this.selectedSchedulingsOnPopupValue));
  });
}
Run Code Online (Sandbox Code Playgroud)

问题是当state.data改变时,state.dataArchived也会改变

所以我想在state.data不订阅的情况下获取当前值。

javascript rxjs redux ngrx angular

4
推荐指数
1
解决办法
2625
查看次数