angular-docs-cn/public/docs/js/latest/api/annotations/View-class.jade

129 lines
2.6 KiB
Plaintext

p.
<span class="location-badge">exported from <a href="/angular2/annotations">angular2/annotations</a></span>
defined in <a href="https://github.com/angular/angular/tree/master/modules/angular2/src/core/annotations/view.js#L34">angular2/src/core/annotations/view.js (line 34)</a>
:markdown
Declares the available HTML templates for an application.
Each angular component requires a single `@Component` and at least one `@View` annotation. The @View
annotation specifies the HTML template to use, and lists the directives that are active within the template.
When a component is instantiated, the template is loaded into the component's shadow root, and the
expressions and statements in the template are evaluated against the component.
For details on the `@Component` annotation, see <a href="angular2/annotations/Component-class"><code>Component</code></a>.
## Example
```
@Component({
selector: 'greet'
})
@View({
template: 'Hello {{name}}!',
directives: [GreetUser, Bold]
})
class Greet {
name: string;
constructor() {
this.name = 'World';
}
}
```
.l-main-section
h2 Members
.l-sub-section
h3 constructor
pre.prettyprint
code.
constructor({
templateUrl,
template,
directives,
renderer
}: {
templateUrl: string,
template: string,
directives: List&lt;Type&gt;,
renderer: string
})
:markdown
.l-sub-section
h3 directives
:markdown
Specifies a list of directives that can be used within a template.
Directives must be listed explicitly to provide proper component encapsulation.
```javascript
@Component({
selector: 'my-component'
})
@View({
directives: [For]
template: '
<ul>
<li *for="item in items">{{item}}</li>
</ul>'
})
class MyComponent {
}
```
.l-sub-section
h3 renderer
:markdown
Specify a custom renderer for this View.
If this is set, neither `template`, `templateURL` nor `directives` are used.
.l-sub-section
h3 template
:markdown
Specifies an inline template for an angular component.
NOTE: either `templateURL` or `template` should be used, but not both.
.l-sub-section
h3 templateUrl
:markdown
Specifies a template URL for an angular component.
NOTE: either `templateURL` or `template` should be used, but not both.