1 | /**
|
---|
2 | * @license
|
---|
3 | * Copyright Google LLC All Rights Reserved.
|
---|
4 | *
|
---|
5 | * Use of this source code is governed by an MIT-style license that can be
|
---|
6 | * found in the LICENSE file at https://angular.io/license
|
---|
7 | */
|
---|
8 | import { Directive, Input, ViewContainerRef } from '@angular/core';
|
---|
9 | /**
|
---|
10 | * @ngModule CommonModule
|
---|
11 | *
|
---|
12 | * @description
|
---|
13 | *
|
---|
14 | * Inserts an embedded view from a prepared `TemplateRef`.
|
---|
15 | *
|
---|
16 | * You can attach a context object to the `EmbeddedViewRef` by setting `[ngTemplateOutletContext]`.
|
---|
17 | * `[ngTemplateOutletContext]` should be an object, the object's keys will be available for binding
|
---|
18 | * by the local template `let` declarations.
|
---|
19 | *
|
---|
20 | * @usageNotes
|
---|
21 | * ```
|
---|
22 | * <ng-container *ngTemplateOutlet="templateRefExp; context: contextExp"></ng-container>
|
---|
23 | * ```
|
---|
24 | *
|
---|
25 | * Using the key `$implicit` in the context object will set its value as default.
|
---|
26 | *
|
---|
27 | * ### Example
|
---|
28 | *
|
---|
29 | * {@example common/ngTemplateOutlet/ts/module.ts region='NgTemplateOutlet'}
|
---|
30 | *
|
---|
31 | * @publicApi
|
---|
32 | */
|
---|
33 | export class NgTemplateOutlet {
|
---|
34 | constructor(_viewContainerRef) {
|
---|
35 | this._viewContainerRef = _viewContainerRef;
|
---|
36 | this._viewRef = null;
|
---|
37 | /**
|
---|
38 | * A context object to attach to the {@link EmbeddedViewRef}. This should be an
|
---|
39 | * object, the object's keys will be available for binding by the local template `let`
|
---|
40 | * declarations.
|
---|
41 | * Using the key `$implicit` in the context object will set its value as default.
|
---|
42 | */
|
---|
43 | this.ngTemplateOutletContext = null;
|
---|
44 | /**
|
---|
45 | * A string defining the template reference and optionally the context object for the template.
|
---|
46 | */
|
---|
47 | this.ngTemplateOutlet = null;
|
---|
48 | }
|
---|
49 | ngOnChanges(changes) {
|
---|
50 | if (changes['ngTemplateOutlet']) {
|
---|
51 | const viewContainerRef = this._viewContainerRef;
|
---|
52 | if (this._viewRef) {
|
---|
53 | viewContainerRef.remove(viewContainerRef.indexOf(this._viewRef));
|
---|
54 | }
|
---|
55 | this._viewRef = this.ngTemplateOutlet ?
|
---|
56 | viewContainerRef.createEmbeddedView(this.ngTemplateOutlet, this.ngTemplateOutletContext) :
|
---|
57 | null;
|
---|
58 | }
|
---|
59 | else if (this._viewRef && changes['ngTemplateOutletContext'] && this.ngTemplateOutletContext) {
|
---|
60 | this._viewRef.context = this.ngTemplateOutletContext;
|
---|
61 | }
|
---|
62 | }
|
---|
63 | }
|
---|
64 | NgTemplateOutlet.decorators = [
|
---|
65 | { type: Directive, args: [{ selector: '[ngTemplateOutlet]' },] }
|
---|
66 | ];
|
---|
67 | NgTemplateOutlet.ctorParameters = () => [
|
---|
68 | { type: ViewContainerRef }
|
---|
69 | ];
|
---|
70 | NgTemplateOutlet.propDecorators = {
|
---|
71 | ngTemplateOutletContext: [{ type: Input }],
|
---|
72 | ngTemplateOutlet: [{ type: Input }]
|
---|
73 | };
|
---|
74 | //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmdfdGVtcGxhdGVfb3V0bGV0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcGFja2FnZXMvY29tbW9uL3NyYy9kaXJlY3RpdmVzL25nX3RlbXBsYXRlX291dGxldC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7O0dBTUc7QUFFSCxPQUFPLEVBQUMsU0FBUyxFQUFtQixLQUFLLEVBQXVELGdCQUFnQixFQUFDLE1BQU0sZUFBZSxDQUFDO0FBRXZJOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQXVCRztBQUVILE1BQU0sT0FBTyxnQkFBZ0I7SUFnQjNCLFlBQW9CLGlCQUFtQztRQUFuQyxzQkFBaUIsR0FBakIsaUJBQWlCLENBQWtCO1FBZi9DLGFBQVEsR0FBOEIsSUFBSSxDQUFDO1FBRW5EOzs7OztXQUtHO1FBQ2EsNEJBQXVCLEdBQWdCLElBQUksQ0FBQztRQUU1RDs7V0FFRztRQUNhLHFCQUFnQixHQUEwQixJQUFJLENBQUM7SUFFTCxDQUFDO0lBRTNELFdBQVcsQ0FBQyxPQUFzQjtRQUNoQyxJQUFJLE9BQU8sQ0FBQyxrQkFBa0IsQ0FBQyxFQUFFO1lBQy9CLE1BQU0sZ0JBQWdCLEdBQUcsSUFBSSxDQUFDLGlCQUFpQixDQUFDO1lBRWhELElBQUksSUFBSSxDQUFDLFFBQVEsRUFBRTtnQkFDakIsZ0JBQWdCLENBQUMsTUFBTSxDQUFDLGdCQUFnQixDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQzthQUNsRTtZQUVELElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLENBQUM7Z0JBQ25DLGdCQUFnQixDQUFDLGtCQUFrQixDQUFDLElBQUksQ0FBQyxnQkFBZ0IsRUFBRSxJQUFJLENBQUMsdUJBQXVCLENBQUMsQ0FBQyxDQUFDO2dCQUMxRixJQUFJLENBQUM7U0FDVjthQUFNLElBQ0gsSUFBSSxDQUFDLFFBQVEsSUFBSSxPQUFPLENBQUMseUJBQXlCLENBQUMsSUFBSSxJQUFJLENBQUMsdUJBQXVCLEVBQUU7WUFDdkYsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLHVCQUF1QixDQUFDO1NBQ3REO0lBQ0gsQ0FBQzs7O1lBbENGLFNBQVMsU0FBQyxFQUFDLFFBQVEsRUFBRSxvQkFBb0IsRUFBQzs7O1lBMUJxRCxnQkFBZ0I7OztzQ0FvQzdHLEtBQUs7K0JBS0wsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQGxpY2Vuc2VcbiAqIENvcHlyaWdodCBHb29nbGUgTExDIEFsbCBSaWdodHMgUmVzZXJ2ZWQuXG4gKlxuICogVXNlIG9mIHRoaXMgc291cmNlIGNvZGUgaXMgZ292ZXJuZWQgYnkgYW4gTUlULXN0eWxlIGxpY2Vuc2UgdGhhdCBjYW4gYmVcbiAqIGZvdW5kIGluIHRoZSBMSUNFTlNFIGZpbGUgYXQgaHR0cHM6Ly9hbmd1bGFyLmlvL2xpY2Vuc2VcbiAqL1xuXG5pbXBvcnQge0RpcmVjdGl2ZSwgRW1iZWRkZWRWaWV3UmVmLCBJbnB1dCwgT25DaGFuZ2VzLCBTaW1wbGVDaGFuZ2UsIFNpbXBsZUNoYW5nZXMsIFRlbXBsYXRlUmVmLCBWaWV3Q29udGFpbmVyUmVmfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuLyoqXG4gKiBAbmdNb2R1bGUgQ29tbW9uTW9kdWxlXG4gKlxuICogQGRlc2NyaXB0aW9uXG4gKlxuICogSW5zZXJ0cyBhbiBlbWJlZGRlZCB2aWV3IGZyb20gYSBwcmVwYXJlZCBgVGVtcGxhdGVSZWZgLlxuICpcbiAqIFlvdSBjYW4gYXR0YWNoIGEgY29udGV4dCBvYmplY3QgdG8gdGhlIGBFbWJlZGRlZFZpZXdSZWZgIGJ5IHNldHRpbmcgYFtuZ1RlbXBsYXRlT3V0bGV0Q29udGV4dF1gLlxuICogYFtuZ1RlbXBsYXRlT3V0bGV0Q29udGV4dF1gIHNob3VsZCBiZSBhbiBvYmplY3QsIHRoZSBvYmplY3QncyBrZXlzIHdpbGwgYmUgYXZhaWxhYmxlIGZvciBiaW5kaW5nXG4gKiBieSB0aGUgbG9jYWwgdGVtcGxhdGUgYGxldGAgZGVjbGFyYXRpb25zLlxuICpcbiAqIEB1c2FnZU5vdGVzXG4gKiBgYGBcbiAqIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJ0ZW1wbGF0ZVJlZkV4cDsgY29udGV4dDogY29udGV4dEV4cFwiPjwvbmctY29udGFpbmVyPlxuICogYGBgXG4gKlxuICogVXNpbmcgdGhlIGtleSBgJGltcGxpY2l0YCBpbiB0aGUgY29udGV4dCBvYmplY3Qgd2lsbCBzZXQgaXRzIHZhbHVlIGFzIGRlZmF1bHQuXG4gKlxuICogIyMjIEV4YW1wbGVcbiAqXG4gKiB7QGV4YW1wbGUgY29tbW9uL25nVGVtcGxhdGVPdXRsZXQvdHMvbW9kdWxlLnRzIHJlZ2lvbj0nTmdUZW1wbGF0ZU91dGxldCd9XG4gKlxuICogQHB1YmxpY0FwaVxuICovXG5ARGlyZWN0aXZlKHtzZWxlY3RvcjogJ1tuZ1RlbXBsYXRlT3V0bGV0XSd9KVxuZXhwb3J0IGNsYXNzIE5nVGVtcGxhdGVPdXRsZXQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICBwcml2YXRlIF92aWV3UmVmOiBFbWJlZGRlZFZpZXdSZWY8YW55PnxudWxsID0gbnVsbDtcblxuICAvKipcbiAgICogQSBjb250ZXh0IG9iamVjdCB0byBhdHRhY2ggdG8gdGhlIHtAbGluayBFbWJlZGRlZFZpZXdSZWZ9LiBUaGlzIHNob3VsZCBiZSBhblxuICAgKiBvYmplY3QsIHRoZSBvYmplY3QncyBrZXlzIHdpbGwgYmUgYXZhaWxhYmxlIGZvciBiaW5kaW5nIGJ5IHRoZSBsb2NhbCB0ZW1wbGF0ZSBgbGV0YFxuICAgKiBkZWNsYXJhdGlvbnMuXG4gICAqIFVzaW5nIHRoZSBrZXkgYCRpbXBsaWNpdGAgaW4gdGhlIGNvbnRleHQgb2JqZWN0IHdpbGwgc2V0IGl0cyB2YWx1ZSBhcyBkZWZhdWx0LlxuICAgKi9cbiAgQElucHV0KCkgcHVibGljIG5nVGVtcGxhdGVPdXRsZXRDb250ZXh0OiBPYmplY3R8bnVsbCA9IG51bGw7XG5cbiAgLyoqXG4gICAqIEEgc3RyaW5nIGRlZmluaW5nIHRoZSB0ZW1wbGF0ZSByZWZlcmVuY2UgYW5kIG9wdGlvbmFsbHkgdGhlIGNvbnRleHQgb2JqZWN0IGZvciB0aGUgdGVtcGxhdGUuXG4gICAqL1xuICBASW5wdXQoKSBwdWJsaWMgbmdUZW1wbGF0ZU91dGxldDogVGVtcGxhdGVSZWY8YW55PnxudWxsID0gbnVsbDtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIF92aWV3Q29udGFpbmVyUmVmOiBWaWV3Q29udGFpbmVyUmVmKSB7fVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcbiAgICBpZiAoY2hhbmdlc1snbmdUZW1wbGF0ZU91dGxldCddKSB7XG4gICAgICBjb25zdCB2aWV3Q29udGFpbmVyUmVmID0gdGhpcy5fdmlld0NvbnRhaW5lclJlZjtcblxuICAgICAgaWYgKHRoaXMuX3ZpZXdSZWYpIHtcbiAgICAgICAgdmlld0NvbnRhaW5lclJlZi5yZW1vdmUodmlld0NvbnRhaW5lclJlZi5pbmRleE9mKHRoaXMuX3ZpZXdSZWYpKTtcbiAgICAgIH1cblxuICAgICAgdGhpcy5fdmlld1JlZiA9IHRoaXMubmdUZW1wbGF0ZU91dGxldCA/XG4gICAgICAgICAgdmlld0NvbnRhaW5lclJlZi5jcmVhdGVFbWJlZGRlZFZpZXcodGhpcy5uZ1RlbXBsYXRlT3V0bGV0LCB0aGlzLm5nVGVtcGxhdGVPdXRsZXRDb250ZXh0KSA6XG4gICAgICAgICAgbnVsbDtcbiAgICB9IGVsc2UgaWYgKFxuICAgICAgICB0aGlzLl92aWV3UmVmICYmIGNoYW5nZXNbJ25nVGVtcGxhdGVPdXRsZXRDb250ZXh0J10gJiYgdGhpcy5uZ1RlbXBsYXRlT3V0bGV0Q29udGV4dCkge1xuICAgICAgdGhpcy5fdmlld1JlZi5jb250ZXh0ID0gdGhpcy5uZ1RlbXBsYXRlT3V0bGV0Q29udGV4dDtcbiAgICB9XG4gIH1cbn1cbiJdfQ== |
---|