Skip to content

Commit b96b61f

Browse files
hdeshevhdeshev
committed
fix(action-bar): Don't remove action items twice.
[email protected] turned action items into views and they can get removed as a part of the view detach process -- think *ngIf templates.
1 parent 6520411 commit b96b61f

File tree

1 file changed

+124
-122
lines changed

1 file changed

+124
-122
lines changed

Diff for: ‎nativescript-angular/directives/action-bar.ts

+124-122
Original file line numberDiff line numberDiff line change
@@ -1,122 +1,124 @@
1-
import { Directive, Component, ElementRef, Optional, OnDestroy } from "@angular/core";
2-
import { ActionItem, ActionBar, NavigationButton } from "ui/action-bar";
3-
import { isBlank } from "../lang-facade";
4-
import { Page } from "ui/page";
5-
import { View } from "ui/core/view";
6-
import { registerElement, ViewClassMeta, NgView, TEMPLATE } from "../element-registry";
7-
8-
let actionBarMeta: ViewClassMeta = {
9-
skipAddToDom: true,
10-
insertChild: (parent: NgView, child: NgView, _atIndex: number) => {
11-
const bar = <ActionBar>(<any>parent);
12-
const childView = <any>child;
13-
14-
if (child instanceof NavigationButton) {
15-
bar.navigationButton = childView;
16-
childView.parent = bar;
17-
} else if (child instanceof ActionItem) {
18-
bar.actionItems.addItem(childView);
19-
childView.parent = bar;
20-
} else if (child.nodeName === TEMPLATE) {
21-
child.templateParent = parent;
22-
} else if (child.nodeName !== "#text" && child instanceof View) {
23-
bar.titleView = childView;
24-
}
25-
},
26-
removeChild: (parent: NgView, child: NgView) => {
27-
const bar = <ActionBar>(<any>parent);
28-
const childView = <any>child;
29-
if (child instanceof NavigationButton) {
30-
if (bar.navigationButton === childView) {
31-
bar.navigationButton = null;
32-
}
33-
childView.parent = null;
34-
} else if (child instanceof ActionItem) {
35-
bar.actionItems.removeItem(childView);
36-
childView.parent = null;
37-
} else if (child.nodeName !== TEMPLATE && child instanceof View &&
38-
bar.titleView && bar.titleView === childView) {
39-
bar.titleView = null;
40-
}
41-
},
42-
};
43-
44-
registerElement("ActionBar", () => require("ui/action-bar").ActionBar, actionBarMeta);
45-
registerElement("ActionItem", () => require("ui/action-bar").ActionItem);
46-
registerElement("NavigationButton", () => require("ui/action-bar").NavigationButton);
47-
48-
@Component({
49-
selector: "ActionBar",
50-
template: "<ng-content></ng-content>"
51-
})
52-
export class ActionBarComponent {
53-
constructor(public element: ElementRef, private page: Page) {
54-
if (isBlank(this.page.actionBarHidden)) {
55-
this.page.actionBarHidden = false;
56-
}
57-
this.page.actionBar = this.element.nativeElement;
58-
this.page.actionBar.update();
59-
}
60-
}
61-
62-
@Component({
63-
selector: "ActionBarExtension",
64-
template: ""
65-
})
66-
export class ActionBarScope { // tslint:disable-line:component-class-suffix
67-
constructor(private page: Page) {
68-
}
69-
70-
public onNavButtonInit(navBtn: NavigationButtonDirective) {
71-
this.page.actionBar.navigationButton = navBtn.element.nativeElement;
72-
}
73-
74-
public onNavButtonDestroy(navBtn: NavigationButtonDirective) {
75-
const nav = <NavigationButton>navBtn.element.nativeElement;
76-
if (nav && this.page.actionBar.navigationButton === nav) {
77-
this.page.actionBar.navigationButton = null;
78-
}
79-
}
80-
81-
public onActionInit(item: ActionItemDirective) {
82-
this.page.actionBar.actionItems.addItem(item.element.nativeElement);
83-
}
84-
85-
public onActionDestroy(item: ActionItemDirective) {
86-
this.page.actionBar.actionItems.removeItem(item.element.nativeElement);
87-
}
88-
}
89-
90-
@Directive({
91-
selector: "ActionItem" // tslint:disable-line:directive-selector
92-
})
93-
export class ActionItemDirective implements OnDestroy {
94-
constructor(public element: ElementRef, @Optional() private ownerScope: ActionBarScope) {
95-
if (this.ownerScope) {
96-
this.ownerScope.onActionInit(this);
97-
}
98-
}
99-
100-
ngOnDestroy() {
101-
if (this.ownerScope) {
102-
this.ownerScope.onActionDestroy(this);
103-
}
104-
}
105-
}
106-
107-
@Directive({
108-
selector: "NavigationButton" // tslint:disable-line:directive-selector
109-
})
110-
export class NavigationButtonDirective implements OnDestroy {
111-
constructor(public element: ElementRef, @Optional() private ownerScope: ActionBarScope) {
112-
if (this.ownerScope) {
113-
this.ownerScope.onNavButtonInit(this);
114-
}
115-
}
116-
117-
ngOnDestroy() {
118-
if (this.ownerScope) {
119-
this.ownerScope.onNavButtonDestroy(this);
120-
}
121-
}
122-
}
1+
import { Directive, Component, ElementRef, Optional, OnDestroy } from "@angular/core";
2+
import { ActionItem, ActionBar, NavigationButton } from "ui/action-bar";
3+
import { isBlank } from "../lang-facade";
4+
import { Page } from "ui/page";
5+
import { View } from "ui/core/view";
6+
import { registerElement, ViewClassMeta, NgView, TEMPLATE } from "../element-registry";
7+
8+
let actionBarMeta: ViewClassMeta = {
9+
skipAddToDom: true,
10+
insertChild: (parent: NgView, child: NgView, _atIndex: number) => {
11+
const bar = <ActionBar>(<any>parent);
12+
const childView = <any>child;
13+
14+
if (child instanceof NavigationButton) {
15+
bar.navigationButton = childView;
16+
childView.parent = bar;
17+
} else if (child instanceof ActionItem) {
18+
bar.actionItems.addItem(childView);
19+
childView.parent = bar;
20+
} else if (child.nodeName === TEMPLATE) {
21+
child.templateParent = parent;
22+
} else if (child.nodeName !== "#text" && child instanceof View) {
23+
bar.titleView = childView;
24+
}
25+
},
26+
removeChild: (parent: NgView, child: NgView) => {
27+
const bar = <ActionBar>(<any>parent);
28+
const childView = <any>child;
29+
if (child instanceof NavigationButton) {
30+
if (bar.navigationButton === childView) {
31+
bar.navigationButton = null;
32+
}
33+
childView.parent = null;
34+
} else if (child instanceof ActionItem) {
35+
bar.actionItems.removeItem(childView);
36+
childView.parent = null;
37+
} else if (child.nodeName !== TEMPLATE && child instanceof View &&
38+
bar.titleView && bar.titleView === childView) {
39+
bar.titleView = null;
40+
}
41+
},
42+
};
43+
44+
registerElement("ActionBar", () => require("ui/action-bar").ActionBar, actionBarMeta);
45+
registerElement("ActionItem", () => require("ui/action-bar").ActionItem);
46+
registerElement("NavigationButton", () => require("ui/action-bar").NavigationButton);
47+
48+
@Component({
49+
selector: "ActionBar",
50+
template: "<ng-content></ng-content>"
51+
})
52+
export class ActionBarComponent {
53+
constructor(public element: ElementRef, private page: Page) {
54+
if (isBlank(this.page.actionBarHidden)) {
55+
this.page.actionBarHidden = false;
56+
}
57+
this.page.actionBar = this.element.nativeElement;
58+
this.page.actionBar.update();
59+
}
60+
}
61+
62+
@Component({
63+
selector: "ActionBarExtension",
64+
template: ""
65+
})
66+
export class ActionBarScope { // tslint:disable-line:component-class-suffix
67+
constructor(private page: Page) {
68+
}
69+
70+
public onNavButtonInit(navBtn: NavigationButtonDirective) {
71+
this.page.actionBar.navigationButton = navBtn.element.nativeElement;
72+
}
73+
74+
public onNavButtonDestroy(navBtn: NavigationButtonDirective) {
75+
const nav = <NavigationButton>navBtn.element.nativeElement;
76+
if (nav && this.page.actionBar.navigationButton === nav) {
77+
this.page.actionBar.navigationButton = null;
78+
}
79+
}
80+
81+
public onActionInit(item: ActionItemDirective) {
82+
this.page.actionBar.actionItems.addItem(item.element.nativeElement);
83+
}
84+
85+
public onActionDestroy(item: ActionItemDirective) {
86+
if (item.element.nativeElement.actionBar) {
87+
this.page.actionBar.actionItems.removeItem(item.element.nativeElement);
88+
}
89+
}
90+
}
91+
92+
@Directive({
93+
selector: "ActionItem" // tslint:disable-line:directive-selector
94+
})
95+
export class ActionItemDirective implements OnDestroy {
96+
constructor(public element: ElementRef, @Optional() private ownerScope: ActionBarScope) {
97+
if (this.ownerScope) {
98+
this.ownerScope.onActionInit(this);
99+
}
100+
}
101+
102+
ngOnDestroy() {
103+
if (this.ownerScope) {
104+
this.ownerScope.onActionDestroy(this);
105+
}
106+
}
107+
}
108+
109+
@Directive({
110+
selector: "NavigationButton" // tslint:disable-line:directive-selector
111+
})
112+
export class NavigationButtonDirective implements OnDestroy {
113+
constructor(public element: ElementRef, @Optional() private ownerScope: ActionBarScope) {
114+
if (this.ownerScope) {
115+
this.ownerScope.onNavButtonInit(this);
116+
}
117+
}
118+
119+
ngOnDestroy() {
120+
if (this.ownerScope) {
121+
this.ownerScope.onNavButtonDestroy(this);
122+
}
123+
}
124+
}

0 commit comments

Comments
 (0)