web前端开发中遇到的问题整理记录——2019-09

1.angular 动态绑定class

<a (click)="update(info)" [class]="info.status ? '' : 'displayed'">修改</a>

带中括号后面就不要带大括号 反之就要带

2.JS删除对象中的某一属性(delete)

var obj={
    name: 'zhagnsan',
    age: 19 
}
delete obj.name //true
typeof obj.name //undefined

3.angular 安全导航操作符 ( ?. ) 和空属性路径

Angular 的安全导航操作符 (?.) 是一种流畅而便利的方式，用来保护出现在属性路径中 null 和 undefined 值

The null hero's name is {{nullHero?.name}}

当name 不存在或者为null时不会报错

4.angular NgTemplateOutlet

NgTemplateOutlet 指令语法

<ng-container 
      *ngTemplateOutlet="templateRefExp; context: contextExp">
</ng-container>

NgTemplateOutlet 使用示例

app.component.ts

export class AppComponent {
  myContext = {$implicit: 'World', localSk: 'Svet',k:"ksdklsdlksdlk"};
}

app.component.html

<ng-container *ngTemplateOutlet="greet"></ng-container>
<hr>

<ng-container *ngTemplateOutlet="eng; context: myContext"></ng-container>
<hr>

<ng-container *ngTemplateOutlet="svk; context: myContext"></ng-container>
<hr>

<ng-template #greet><span>Hello</span></ng-template>
<ng-template #eng let-name><span>Hello {{name}}!</span></ng-template>
<ng-template #svk let-person="k"><span>Ahoj {{person}}!</span></ng-template>

若 let 语法未绑定任何属性名，则上下文对象中 $implicit 属性，对应的值将作为默认值。