In Angular 1, you could use `restrict` to determine how your directive could be used. For example:

```
angular.module('foo').directive('fooDirective', [function () {
  return {
    restrict: 'AE',
    /* ... */
  }
}]);

```

And then you would be able to use this in your template either as an attribute or as an element:

```
<foo />

```

**OR**

```
<div foo />

```

I've been reading on sites such as [this one](https://angular.io/docs/ts/latest/guide/attribute-directives.html) that in Angular2, the `select` proper way to define how your component is used now:

```
@Component({
  selector: 'Sample'
});

```

Then in your template:

```
<Sample />

```

Similarly, adding brackets allows it to be used as an attribute:

```
@Component({
  selector: '[Sample]'
});

```

Template:

```
<div Sample />

```

But what if I want to allow it to be used both as an attribute and as an element, the equivalent of `restrict: 'AE'` in Angular 1?