模板

<pre *ngIf="isAdmin()">{{email|json}} - {{user|json}}</pre>

成分

isAdmin() {
    console.log('isAdmin: ', this.bcAuthService.isAdmin());
    return this.bcAuthService.isAdmin();
}

服务

isAdmin() {
    return this.admins.includes(localStorage.getItem("email"));
}

问题

组件中的函数会多次打印。为什么？这是错误的吗？什么是更好的方法？

我正在寻找一种在组件中的多个位置重复相同标记的方法。我知道我可以使用一个新组件，但我正在寻找一些不那么严重的东西。

html

        <nav class="pages">
            <ul class="inline">
                <li 
                    *ngFor="let p of pages; let i = index;"
                    [ngClass]="{'active': page.current_page == i+1}"
                    (click)="onPageChange(i+1, $event)"
                >{{i+1}}</li>
            </ul>
        </nav>

有没有一种方法可以ng-template在同一组件内的多个位置重复相同的标记...如下所示

<div id="header"> <ng-template [innHTML]="#pages"></ng-template> </div>
<div id="content">...</div>
<div id="footer"> <ng-template [innHTML]="#pages"></ng-template> </div>

<ng-container #pages>
    <ul class="inline">
        <li *ngFor="let p of pages; let i = index;" [ngClass]="{'active': page.current_page == i+1}" (click)="onPageChange(i+1, $event)">{{i+1}}</li>
    </ul>
</ng-container>

我正在开发和测试一个应用程序。当我期待使用 6 位数笔发送短信时，我收到以下消息。

{code: "auth/too-many-requests", message: "由于异常活动，我们已阻止来自此设备的所有请求。请稍后重试。"}

所以我尝试去authentication=> Sign-in method=>phone并添加 # 进行测试，但出现以下错误

添加测试电话号码时出错

有谁知道如何解决这些问题之一，以便我可以继续测试我的应用程序。

谢谢

在我的组件中，我试图取消选择具有相同类名的所有复选框。

querySelector每次（或一次）仅选择第一个...，querySelectorAll并且不选择任何内容。

这就是功能。我知道这样使用jQuery是错误的，但这说明了我的目标。

unsetAllOptions(){
    var self = this;
    var i = 0;
    $("input.option_input").each(function(){
        i++;
        var element = self.elRef.nativeElement.querySelector("input.option_input")[i];
        if(element.checked){
            // console.log(i)
            console.log('unchecking:',i);
            element.checked=false;
            element.dispatchEvent(new Event('change'));
            element = "";
        }
    });
}

我试图removeEventListener在我的角度组件中： Javascript removeEventListener 不工作

    ...
    ngOnInit() {
        document.addEventListener('visibilitychange', () =>this.handleVisibleState(), true);
    }

    ngOnDestroy() {
        document.removeEventListener('visibilitychange', () => this.handleVisibleState(), true);
    }

    handleVisibleState() {
        let vis = document.visibilityState === 'visible';
        this.configsService.update_collab_visible(vis);
    }
    ...

addEventListener即使在上述作品之后ngOnDestroy ()

如何从角度组件中的文档解除可见性状态？

尝试 2

    private visibilityChangeCallback: () => void;

    ngOnInit() {
        this.visibilityChangeCallback = () => this.handleVisibleState();
        document.addEventListener('visibilitychange', this.handleVisibleState, true);
    }

    ngOnDestroy() {
        document.removeEventListener('visibilitychange', this.handleVisibleState, true);
    }

    handleVisibleState() {
        let vis = document.visibilityState === 'visible';
        console.log(typeof this.configsService); // undefined
        this.configsService.update_collab_visible(vis);
    }

结果：

错误类型错误：无法读取未定义的属性“update_collab_visible”

在这呆了几天。我正在我的 angular/nodejs 应用程序上制作一个登录表单。bc-api 能够验证用户/密码。现在，我需要允许客户使用 sso 进入商店，但生成的 jwt 不起作用。我在下面的尝试......我正在寻找故障排除技巧。

生成 JWT/sso_url

var jwt = require('jwt-simple');

function decode_utf8(s) {
  return decodeURIComponent(escape(s));
}

function get_token(req, data) {
    let uid = req.id;
    let time = Math.round((new Date()).getTime() / 1000);
    let  payload = {
        "iss": app.clientId,
        // "iat": Math.floor(new Date() / 1000),
        "iat": time,
        "jti": uid+"-"+time,
        "operation": "customer_login",
        "store_hash": app.storeHash,
        "customer_id": uid,
        "redirect_to": app.entry_url
    }
    let token = jwt.encode(payload, app.secret, 'HS512');
    token = decode_utf8(token);
    let sso_url = {sso_url: `${app.entry_url}/login/token/${token}`}
    return sso_url
}

payload 决心

{ …

请参阅下面的示例代码...我想在我的角度组件的 2 个地方使用相同的标记。我怎样才能做到这一点？

我知道我可以注册一个新组件，但这听起来有点过头了。

<div class="mobile-aside" *ngIf="isMobile"><!-- aside template here --></div>
<div class="desktop-aside" *ngIf="!isMobile"><!-- aside template here --></div>

<ng-template #aside>
  <category-aside
    [categoryData]="categoryData"
    [currentParams]="queryParams"
    (filter)="onFilter($event)"
    (changepage)="onPage($event)"
    (sort)="onSort($event)"
    (sortdir)="sortDir($event)"
    (search)="onSearch($event)"
  ></category-aside>
</ng-template>

• 我有这个库，@my-proj/common它 export * from './lib/environment';的index.ts
• 我的前端（ng）和后端（express // Nest）应用程序import { environment } from '@my-proj/common'；
• 当我构建这些应用程序时，仅使用开发变量。IE npx nx build angular-app --prod;
• 我想既然我是用 prod 标志构建的，那么它会使用environment.prod.ts from @my-proj/common?

项目配置：

"common": {
  "root": "libs/common",
  "sourceRoot": "libs/common/src",
  "projectType": "library",
  "architect": {
    "build": {
      "builder": "@nrwl/node:package",
      "outputs": ["{options.outputPath}"],
      "configurations": {
        "production": {
          "fileReplacements": [
            {
              "replace": "libs/common/src/lib/environment.ts",
              "with": "libs/common/src/lib/environment.prod.ts"
            }
          ]
        }
      },
      "options": {
        "outputPath": "dist/libs/common",
        "tsConfig": "libs/common/tsconfig.lib.json",
        "packageJson": "libs/common/package.json",
        "main": "libs/common/src/index.ts",
        "assets": ["libs/common/*.md"]
      }
    }
  }, …

我在服务中具有此功能，可从我的API获取数据

getProductById(id) {
    return this.http.get<any>(piUrl + '/id', { params: id }).catch(this.errHandler);
}

我知道如何在组件中获取数据的唯一方法就是这样订阅。

this.myService.getProductById(id).subscribe(product => this.product = product);

但是一旦没有流，我就只需要数据。我如何一次获取数据？这样的事情。

this.myService.getProductById(id).once(product => this.product = product);

在以下示例中，get_bc_templates()返回 before get_bc_template()。

async get_bc_templates(mfpns, cnetDB, cb) {
    const templates = await Promise.all([mfpns.map(async item => await this.get_bc_template(item, cnetDB))]);
    if (cb) {
        console.log(`prints immediately. before get_bc_template`.green.bold, templates)
        return cb(200, templates.map(template => template.bigCommerce_object))
    }
}




async get_bc_template(mfpn, cnetDB, cb ?) {
    console.log('this logs after the get_bc_templates already returns', mfpn);
    let collective_product = {
        CNET_data: promised_data[1],
        JAX_data: JAX_data,
        suggested_retail: await this.calc_suggested_retail(JAX_data),
        }
    return collective_product;
}

我需要帮助重写它，因此get_bc_templates返回一个数组get_bc_template() => collective_product(get_bc_template() 一次很好用)。