小编Bhr*_*jni的帖子

演示版

您好，我在我的应用程序中使用 Angular8。这里我使用了 jspdf 和 html2canvas 将 html 转换为 pdf。但我只能打印半页而不是整页。谁能帮助我哪里出错了。

我附上了一个演示，当我在下拉列表中选择任何值时，会打开另一个 div，因此我需要获取 div 部分中所有内容的完整值。请帮忙。我得到这样的输出，但它不包含预期的完整值：

输出

如果有任何其他方法可以按照我的要求提供输出，也可以接受。

TS：

 public downloadPdf() {
    var data = document.getElementById('pdfDownload');
    html2canvas(data).then(canvas => {
      // Few necessary setting options
      var imgWidth = 208;
      var imgHeight = canvas.height * imgWidth / canvas.width;
      alert(imgHeight)
      const contentDataURL = canvas.toDataURL('image/png')
      let pdf = new jspdf('p', 'mm', 'a4'); // A4 size page of PDF
      var position = 0;
      pdf.addImage(contentDataURL, 'PNG', 0, position, imgWidth, imgHeight);
      //  pdf.save('new-file.pdf');
      window.open(pdf.output('bloburl', { filename: 'new-file.pdf' }), '_blank'); …

我有2个表,一个是车辆和公司.如果我点击车辆名称,其相应的公司名称将显示在公司表中.所以,现在我有大约12辆车,当我点击第12辆车时,它的名字显示在公司表上,只有当我向上滚动时才能看到.所以我需要直接关注公司名称而不是滚动.请帮忙

这是我的车辆和公司的HTML代码:

车辆表:

<md-card *ngFor="let vehicle of vehicleLists | companyfilter:filter" (click)="goToCompany(vehicle)">
 <div >
    {{vehicle.vehicleName}}
  </div> 
   </md-card>

公司表:

<md-card  *ngFor="let company of companyLists | vehiclefilter:myfilter">
 <div>
     {{company.companyName}}
 </div></md-card>

TS代码:

goToCompany(vehicle){
this.document.body.scrollTop = 0;
}

在这个链接的答案的帮助下,我能够得到我的要求: 在angular2中滚动顶部

但是,这里它仅适用于滚动顶部,如果公司名称列表低于vwhicle名称,它不会下降.我也需要我的移动响应工作,在这个plunker它工作正常,biut不是我的代码.

Plunker链接:https://plnkr.co/edit/ZjZApeGBk1P6OamYv21T?p = preview 请帮助.

设置并使用自己的客户端ID运行后，我将完成登录过程，并在弹出窗口中选择所需的Google帐户。

选择此选项后，登录将失败，控制台中的错误为：

err = {error: "popup_closed_by_user"}

有人可以帮我解决这个问题吗

我有Angular2 Material Fab Speed Dial,我需要以链接Angular1链接的格式为Angular2做动画.这是Angular1动画的一部分.请建议我在Angular2中以同样的方式.

在上面的链接中,我需要我的代码像md-scale示例一样工作.

我在这里通过共享HTML代码Angular2:

<div id="right-side" class="col-lg-1 col-md-1 col-sm-1 col-xs-1" layout="column">
  <button md-mini-fab class="md-fab md-raised md-primary" aria-label="New Task" (click)='FabToggle = !FabToggle'>
    <md-icon style="color:white;">menu</md-icon>
  </button>
  <div class="fab-actions" [ngClass]="{'fabActionsHide':!FabToggle,'fabActionsShow':FabToggle}">
    <button md-mini-fab class="md-fab md-raised md-primary" (click)='reload()'>
      <md-icon svgIcon="refresh"></md-icon>
    </button>
    <button md-mini-fab class="md-fab md-raised md-primary" (click)='DF()'>
      <md-icon svgIcon="pdf"></md-icon>
    </button>
    <button md-mini-fab class="md-fab md-raised md-primary" (click)='SV()'>
      <md-icon svgIcon="csv"></md-icon>
    </button>
    <button  md-mini-fab class="md-fab md-raised md-primary (click)="addModal.show()">
      <md-icon style="color:white;">add</md-icon>
    </button>
  </div>
</div>

CSS

.fab-actions button {
     margin-top: 8px;
    }

    #right-side button { …

我有一个包含3个字段的部分,当点击新按钮时,我必须得到相同的部分.我没有错误,所以我没有得到我错的地方

这里的例子

HTML:

     <form *ngFor="let emergency of Emergencies; let i = index">
        <div>
          <label > Name</label>
  <input type="text"   [(ngModel)]="emergency.Name" name="emergency.Name" 
          />
        </div>
        <div>
          <label >Phone</label>
          <input type="text" OnlyNumber="true" [(ngModel)]="emergency.Phone" name="emergency.Phone"
            maxlength="15" />
        </div>
        <div>
          <label >Relations</label>
          <select class="col-lg-6 col-md-6 col-sm-6 col-xs-6"[(ngModel)]="emergency.ship">
            <option >{{ship.Description}}</option>
          </select>
        </div>
      </div>
    </form>

您好，我使用反应式表单将对象数组绑定到 formArray，但在这里，如果我选择一个部分中的任何一项，然后单击“向右移动/向左移动”，则整个对象已从一个部分移动到另一部分。但该功能工作正常，但我无法检测到 form.valuechanges() 中从一个部分到其他部分所做的更改。任何人都可以帮助我检测更改，以防项目已从一个部分移动到另一部分，在这里我想要更改检测，但功能必须按原样工作，我的意思是整个对象从一个部分移动到另一部分。

提前致谢。

我这里有工作 demo2，我希望我之前发布的 demo1 能够像这个 demo2 一样工作，并且 formarray 工作。 演示2

演示： 演示 1

TS：

 private settingsGroupInfoForm() {
    if (!this.agentDetailsList) {
      // Add
     this.agentGroupViewInfoForm = this.FB.group({
          agentGroupView: this.FB.array(
            this.agentInView.map(x=>(x))
          ),
        })
    } else {
      // Edit
      if (this.agentDetailsList) {

       this.agentGroupViewInfoForm = this.FB.group({
          agentGroupView: this.FB.array(this.agentInView.map(x=>(x))),

      })
      }
      this.agentGroupViewInfoForm.valueChanges.subscribe(data => {
          this.formEdit = true;
          console.log('agentGroupViewInfoForm', this.formEdit)
        })
      }
    }

HTML：

 <div class="card-body overflow-auto py-0" *ngIf="agentGroupViewInfoForm"
            [formGroup]="agentGroupViewInfoForm">
                <ul class="list-group list-group-flush" *ngFor="let child of agentInView"   name="agentInGroup" formArrayName="agentGroupView">
                  <li class="list-group-item {{isInActiveItems(child) ? …

我在模糊事件中使用货币管道。但它第一次工作正常，当我收到验证错误消息时，如果我删除了几个数字并出来，它不会被格式化为货币格式仍然是用户删除的格式。例如，我给出了这个数字： 36543265所以当我从输入中出来时，它被格式化为$36,543,265.00，带有验证错误消息。所以如果我265.00从 中删除 $36,543,265.00，我仍然有错误验证消息。所以验证错误消息消失并保持这种格式，$36,543但它没有达到正确的格式。USD清除验证消息后，如何使其成为正确的货币管道格式。

如何根据用户删除的值使其正确格式化。

TS：

public transformAmount(element, name) {
  if (name == "amount") {
    let formattedAmount = this.currencyPipe.transform(this.eoInfoForm.value.amount, 'USD');
    element.target.value = formattedAmount;
    this.eoInfoForm.get('amount').setValue(formattedAmount);
    if (this.eoInfoForm.get('amount').status === 'VALID') {
      this.amt = false; 
    } 
    else {
      this.amt = true;
    } 
  } 
}

HTML：

 <input type="text" class="form-control" placeholder="Amount in dolars"
                    formControlName="amount" autocomplete="off" maxlength="8" allowNumberOnly (blur)="transformAmount($event,'amount')" [ngClass]="{ 'is-invalid': amt  && eoInfo.amount.invalid }">
                    <div *ngIf="amt && eoInfo.amount.invalid" class="invalid-feedback">
                        <div *ngIf="amt && eoInfo.amount.invalid">Maximum of 8 …

我使用了自定义弹出模式来接收来自用户的确认消息。在这里，我有一些基于焦点的输入字段，如果必须从用户那里获取任何验证/确认消息，则会打开弹出消息。当弹出窗口打开时，选项卡焦点将在背景中已经选择的值上而不是在弹出窗口上，如果我使用选项卡，它会转到背景中的下一个输入字段，而不是将焦点放在弹出窗口上。我该如何处理这个问题？这里基于选项卡焦点到按钮enter/spacebar 它需要那个特定按钮的事件。我使用了一个指令来处理键盘中“ESC”上的按键。在这里，我想处理这些事情，但不知道如何使其发挥作用。1.这里默认如果只有一个按钮，那么标签焦点必须在“确定”按钮上，如果有2个按钮说“确定”和“取消”标签焦点在“确定”按钮上。2. 通过使用选项卡/鼠标，我必须能够在按钮之间切换。需要帮助。

演示： 演示

为了获得弹出窗口，我使用了服务文件：

服务.ts：

activate: (header?: string,message?: string, ok?: string,cancel?:boolean) => Promise<boolean>;

HTML：

 <input type="text" class="form-control" placeholder="Group Code" name="groupCode"
               name="groupCode" (blur)="tabOpen()">

:

  tabOpen() {
    this.notificationService.activate("Validation Message", "First POP UP? ", "Yes").then(responseOK => {
        if (responseOK) { }
      });
  }

基于此，blurout我正在调用该服务并显示弹出窗口。一旦弹出窗口打开，我希望选项卡焦点位于该弹出窗口上，而不管背景屏幕上的弹出窗口是什么。但关键功能应该只用于弹出窗口，当弹出窗口关闭时，再次控制回到后台的特定字段并相应地起作用。

演示

嗨，我在 Angular8 应用程序中使用angularx-social-login的版本2.2.1。由于 google auth 令牌过期 1 小时，我必须调用刷新令牌的方法。我浏览了许多网站，但无法获得解决方案。我已经在应用程序模块中安装和声明，现在使用登录组件来获取身份验证令牌和电子邮件地址，id 来自登录谷歌按钮点击。但我不知道如何为附近的到期时间调用刷新方法。请帮忙。

HTML：

<button type="submit" class="btn btn-primary btn-block" (click)="signInWithGoogle()">Sign in with Google</button>

:

public signInWithGoogle(): void {
    let socialUser = this.oauthService.signIn(GoogleLoginProvider.PROVIDER_ID).then((userData) => {
      if(userData.idToken){
      
      } else {
        alert('danger')
      }
   });
  }

app.module.ts:

import { SocialLoginModule, AuthServiceConfig } from "angularx-social-login";
import { GoogleLoginProvider } from "angularx-social-login";

 imports: [
    SocialLoginModule
  ],
  providers: [
    {
      provide: AuthServiceConfig,
      useFactory: provideConfig
    }],

let config = new AuthServiceConfig([
  {
    id: GoogleLoginProvider.PROVIDER_ID,
    provider: new GoogleLoginProvider("1051927480520-u87cv859uap5e6t4r5f52mk96a8a6nhe.apps.googleusercontent.com") …

我是Angular2的新手.现在我需要限制输入字段中的特殊字符,如果我给它必须采用的数字和字母,应该阻止特殊字符.可以任何人帮助请.

我在这里分享代码:

In HTML:
<md-input-container>
<input type="text" (ngModelChange)="omit_special_char($event)" mdInput name="name" [(ngModel)]="company.name" placeholder="Company Name" #name="ngModel" minlength="3" required>
</md-input-container>

在TS:public e:any;

omit_special_char(val)
{
   var k;
    document.all ? k = this.e.keyCode : k = this.e.which;
    return ((k > 64 && k < 91) || (k > 96 && k < 123) || k == 8 || k == 32 || (k >= 48 && k <= 57));
}