小编Him*_*ora的帖子

是否可以根据附加的点击处理程序在模板中定义条件？

例如,我能得到的最接近的是评估click方法条目的条件.

<a class='user' (click)=" isOverflown? menu.toggle($event): '' "></a>

有没有一种方法可以避免在标志isOverflown为假的情况下完全绑定到click事件？

此外,我不想ng-if在元素上使用并复制模板.即:创建一个具有click绑定的元素,然后创建另一个不绑定的元素,然后使用它来显示/隐藏它们ng-if

我正在使用Angular 6.1.0构建一个库

• ng new lib-demo
• ng generate library my-lib

所有文章建议使用如下--prod标志运行库的构建:

ng build my-lib --prod

但是,这会引发错误

Configuration 'production' could not be found in project 'my-lib'.

这可能是正确的,因为当我查看angular.jsonproduction build configuration时,库项目中没有a的定义.它仅适用于应用程序项目.

以下是我在使用的库项目的构建配置下所拥有的内容 ng-packagr

"build": {
      "builder": "@angular-devkit/build-ng-packagr:build",
      "options": {
        "tsConfig": "projects/my-lib/tsconfig.lib.json",
        "project": "projects/my-lib/ng-package.json"
      }
    }

所以这里的问题是,--prod不再需要标志,只是运行ng build m-lib会生成prod构建？

看看dist文件夹的内容看起来如此,但我不是百分百肯定.如果有人可以验证这一点,那就太好了.

我想覆盖DataTable组件的模板,primeng这就是我的代码的样子:

我-datatable.component.ts

import { Component, OnInit, ElementRef, Renderer2, ChangeDetectorRef } from '@angular/core';
import { DataTable, DomHandler } from 'primeng/primeng';
import { ObjectUtils } from '../../../../node_modules/primeng/components/utils/ObjectUtils'
import { ColumnHeaders } from '../../../../node_modules/primeng/components/datatable/datatable'

@Component({
  selector: 'my-datatable',
  templateUrl: './my-datatable.component.html',
  styleUrls: ['./my-datatable.component.scss']    
})
export class MyDatatableComponent extends DataTable {

    constructor(el: ElementRef, domHandler: DomHandler, renderer: Renderer2, changeDetector: ChangeDetectorRef, objectUtils: ObjectUtils) { 
        super(el, domHandler, renderer, changeDetector, objectUtils);
        console.log('MyDatatableComponent');
    }

}

my-datatable.component.html,此文件与基本组件具有相同的模板.想法是先运行然后进行修改

<div [ngStyle]="style" [class]="styleClass" [style.width]="containerWidth" [ngClass]="{'ui-datatable ui-widget':true,'ui-datatable-reflow':responsive,'ui-datatable-stacked':stacked,'ui-datatable-resizable':resizableColumns,'ui-datatable-scrollable':scrollable}">
  <div class="ui-datatable-loading ui-widget-overlay" *ngIf="loading"></div> …

请考虑以下代码示例:

<div *ngIf="condition; else elseBlock">
    <!-- markup here --> 
</div>
<ng-template #elseBlock>
     <div>
         <!-- additional markup here -->
     </div> 
</ng-template>

我可以实现相同功能的另一种方法是:

<div *ngIf="condition">
    <!-- markup here --> 
</div>
<div *ngIf="!condition">
     <!-- additional markup here -->
</div>

我想知道应该使用这两种方式中的哪种方式的具体原因以及原因？

我有一个div (top navigation)嵌套在flex容器内的。当top-nav展开时，我希望它占据视口的整个高度。我知道这可以通过设置高度来实现，100vh但并未得到广泛支持。所以，我需要一种更传统的方式来实现这一点。

该html和body有一个height 100%，但该视图的内容溢出，我可以滚动页面。

我现在拥有的是：

.top-nav .top-nav-links-wrapper {
    position: fixed;
    width: 100%;
    background-color: #fff;
    top: 50px;
    left: 0;
    height: 100%;        
}

有没有办法实现这一点（除了将高度设置为100vh）？