angular 中指令能实现正则吗？

Question

我现在想写一个在模板中申明临时变量的指令，可以像ng-template那样let-name="";但是我试了一下不可用[let-*]来实现，那ng-template中的let-是怎么搞的呢？
求指导

Answer 1

Angular中ng-template的let不是声明临时变量的。

• let-xxx 是暴露ngTemplateOutletContext中的$implicit属性作为模板变量
• let-xxx="foo" 是暴露ngTemplateOutletContext中的foo属性作为模板变量

参考资料：

1. https://angular.io/api/common...
2. https://stackoverflow.com/que...

Answer 2

import { Directive, ViewContainerRef, TemplateRef, Input } from '@angular/core';

@Directive({
  selector: '[let]'
})
export class ExpAsDirective {
  _context: any = {name: 'wei', tt: '1ttvalue   '};
  private _thenTemplateRef: TemplateRef<any>|null = null;
  @Input() public set letContext(val) {
    this._context = val;
    this._updateView();
  }
  constructor(private _viewContainer: ViewContainerRef, templateRef: TemplateRef<any>) {
    this._thenTemplateRef = templateRef;
  }
  private _updateView() {
    this._viewContainer.clear();
    this._viewContainer.createEmbeddedView(this._thenTemplateRef, this._context);
  }
}

使用

<div *let="let tt = tt;let age1 = age;context: {tt: name, age: 12}">{{tt}}-------{{age1}}</div>
<input [(ngModel)]="name">

就是比较麻烦