| Name | Type | Default |
|---|
|
animationType
|
enum:NavigationBarAnimationType
|
'slide'
|
enum NavigationBarAnimationType { none, slide, fade } Sets or gets the animationType property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [animationType]="'fade'"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
arrowPosition
|
enum:NavigationBarArrowPosition
|
'right'
|
enum NavigationBarArrowPosition { left, right } Sets or gets the arrowPosition property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [arrowPosition]="'left'"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
collapseAnimationDuration
|
Number
|
400
|
Sets or gets the collapseAnimationDuration property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [collapseAnimationDuration]="3000"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
disabled
|
Boolean
|
false
|
Sets or gets the disabled property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [disabled]="true"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
expandAnimationDuration
|
Number
|
400
|
Sets or gets the expandAnimationDuration property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [expandAnimationDuration]="3000"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
expandMode
|
enum:NavigationBarExpandMode
|
'singleFitHeight'
|
enum NavigationBarExpandMode { single, singleFitHeight, multiple, toggle, none } Sets or gets the expandMode property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [expandMode]="'single'"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
expandedIndexes
|
Array<Number>
|
[]
|
Sets or gets the expandedIndexes property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [expandedIndexes]='[0, 1]'> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
height
|
String | Number
|
'auto'
|
Sets or gets the height property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
initContent
|
(index:Number) => Void
|
null
|
Sets or gets the initContent property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [initContent]="initContent"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
rtl
|
Boolean
|
false
|
Sets or gets the rtl property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [rtl]="true"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
showArrow
|
Boolean
|
true
|
Sets or gets the showArrow property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [showArrow]="false"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
theme
|
String
|
''
|
Sets or gets the theme property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [theme]="'energyblue'"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
toggleMode
|
enum:NavigationBarToggleMode
|
click
|
enum NavigationBarToggleMode { click, dblclick, none } Sets or gets the toggleMode property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300" [toggleMode]="'dblclick'"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
width
|
String | Number
|
'auto'
|
Sets or gets the width property.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent {
|
|
|
|
collapsingItem
|
Event
|
|
This event is triggered when a jqxNavigationBar item is going to be collapsed.
Code examples
Bind to the collapsingItem event of jqxNavigationBar.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar (onCollapsingItem)="CollapsingItem($event)" [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent { CollapsingItem(event: any): void
|
|
collapsedItem
|
Event
|
|
This event is triggered when a jqxNavigationBar item is collapsed.
Code examples
Bind to the collapsedItem event of jqxNavigationBar.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar (onCollapsedItem)="CollapsedItem($event)" [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent { CollapsedItem(event: any): void
|
|
expandingItem
|
Event
|
|
This event is triggered when a jqxNavigationBar item is going to be expanded.
Code examples
Bind to the expandingItem event of jqxNavigationBar.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar (onExpandingItem)="ExpandingItem($event)" [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent { ExpandingItem(event: any): void
|
|
expandedItem
|
Event
|
|
This event is triggered when a jqxNavigationBar item is expanded.
Code examples
Bind to the expandedItem event of jqxNavigationBar.
import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar (onExpandedItem)="ExpandedItem($event)" [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent { ExpandedItem(event: any): void
|
|
|
| Name | Return Type | Arguments |
|---|
|
add
|
Void
|
header: String | Number,
content: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.add(1, 'Header','Content');
|
|
collapseAt
|
Void
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.collapseAt(1);
|
|
disableAt
|
Void
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.disableAt(1);
|
|
disable
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.disable();
|
|
destroy
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.destroy();
|
|
expandAt
|
Void
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.expandAt(1);
|
|
enableAt
|
Void
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.enableAt(1);
|
|
enable
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.enable();
|
|
focus
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.focus();
|
|
getHeaderContentAt
|
String
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { let value = this.myNavigationBar.getHeaderContentAt(1);
|
|
getContentAt
|
String
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { let value = this.myNavigationBar.getContentAt(1);
|
|
hideArrowAt
|
Void
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.hideArrowAt(1);
|
|
invalidate
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.invalidate();
|
|
insert
|
Void
|
Index: Number,
header: String | Number,
content: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.insert(1, 'Header','Content');
|
|
refresh
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.refresh();
|
|
render
|
Void
|
None
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.render();
|
|
remove
|
Void
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.remove(1);
|
|
setContentAt
|
Void
|
index: Number,
item: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.setContentAt(1, 'Content');
|
|
setHeaderContentAt
|
Void
|
index: Number,
item: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.setHeaderContentAt(1, 'Header');
|
|
showArrowAt
|
Void
|
index: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.showArrowAt(1);
|
|
update
|
Void
|
index: Number,
header: String | Number,
content: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { this.myNavigationBar.update(1, 'Title','Content');
|
|
val
|
String | Number
|
value: String | Number
|
import { Component, ViewChild, AfterViewInit } from "@angular/core"; @Component({ selector: "app-root", template: ` <jqxNavigationBar #myNavigationBar [width]="400" [height]="300"> <div>Early History of the Internet</div> <div> <ul> <li>1961 First packet-switching papers </li> <li>1966 Merit Network founded </li> </ul> </div> <div>Merging the networks and creating the Internet </div> <div> <ul> <li>1981 Computer Science Network (CSNET) </li> <li>1982 TCP/IP protocol suite formalized </li> </ul> </div> <div>Popular Internet services </div> <div> <ul> <li>1990 IMDb Internet movie database </li> <li>1995 Amazon.com online retailer </li> </ul> </div> </jqxNavigationBar> ` }) export class AppComponent implements AfterViewInit { @ViewChild( 'myNavigationBar') myNavigationBar: jqxNavigationBarComponent; ngAfterViewInit(): void { let value = this.myNavigationBar.val(1);
|
