Question

如何在Angular 2.x中创建Decorator指令？我正在编写针对Angular的alpha版本，并试图重现AngularJS（1.x）指令ngClass中的功能。下面是我在Angular中尝试自己的NgClass的片段。我想要做的是观察一些表达式的值，该表达式可能包含类名哈希到布尔表达式。随着这些表达式的更改，将在已应用装饰器的元素上的classList属性中添加或删除名称。

这种语法有什么问题？装饰器甚至不是工作的正确模板，也许我应该创建一个模板指令？即便如此，使用Angular声明Directives的语法是什么？我接受ES5中的答案，但我更喜欢ES6和AtScript。

对于上下文，我写这篇文章是为了准备一个演讲，我预览了用Angular 2及其以外编写应用程序的方式。

@Decorator({
  selector: '[ng-class]',
  bind: {'NgClass': 'class'},
  observe: {'ngClass': 'ngClassChanged'}
})
export class NgClass {
  constructor(element:NgElement) {
    this.element = element;
  }

  ngClassChanged(newValue) { 
    let classNames = [];
    if(newValue){
      console.log(newValue);
      this.element.className = newValue;
    }
    else {
        this.element.className = "";
    }

  }
}

Answer 1

截至2015年4月，Angular2参考文档中的语法为

@Decorator({ selector: '[primary]'}) 
class Primary {                      
   const ructor(field:Field ) { ... }  
}

https://github.com/angular/angular/blob/master/modules/angular2/docs/core/02_directives.md

在AtScript中声明Angular 2.0装饰器的正确语法是什么？

1 个答案: