Pages UI
Search…
Pages UI
v5.0.1 - Pages Angular
Getting Started
Layouts
Routing
Styles
Layout Components
Header
Menu Items
Sidebar
Horizontal Menu
Secondary Sidebar
Quick View
Overlay Search
Directives
Parallax
Retina Image
Bootstrap Components
Forms
Checkbox and Radio
Form Group
Input Helpers
Switch Toggle
Select
Select FX
Typeahead
Date Picker
Time Picker
Quill Editor
File Uploader
UI Components
Progress Bar
List View
Cards
Social Cards
Collapse
Tabs
Tree View
Sliders
Notifications
Tables / Datatables
Maps
Session and other pages
Service
Dashboards
Widgets
Charts
Change log
Powered By
GitBook
Select FX
Importing
First import it to your app module or any submodule as you wish
1
import
{
pgSelectfx
}
from
'../@pages/components/cs-select/select.module'
;
2
@
NgModule
({
3
imports
:
[
pgSelectfx
,
...
]
4
})
5
export
class
AppModule
(){}
Copied!
How to use
Basic Select with Search
HTML
Typescript
1
<
pg-select-fx
style
=
"
width
:
110px
"
[(ngModel)]
=
"
selectedOptionCS
"
[PlaceHolder]
=
"'
Select
'"
AllowClear
>
2
<
pg-selectfx-option
3
*ngFor
=
"
let option of csoptions
"
4
[Label]
=
"
option.label
"
5
[Value]
=
"
option
"
6
[Disabled]
=
"
option.disabled
"
>
7
</
pg-selectfx-option
>
8
</
pg-select-fx
>
Copied!
1
csoptions
=
[
2
{
value
:
'Web-safe'
,
label
:
'Web-safe'
},
3
{
value
:
'Helvetica'
,
label
:
'Helvetica'
},
4
{
value
:
'SegeoUI'
,
label
:
'SegeoUI'
}
5
];
6
selectedOptionCS
;
Copied!
API
parameter
Instructions
Types of
Defaults
AllowClear
When this attribute is added, it supports clearing, and the radio mode is valid.
attribute
-
PlaceHolder
Select box default text
String
no
Options API
parameter
Instructions
Types of
Defaults
Label
Display option content for display
String
​
#OptionTemplate
Used to customize the display of the drop-down section option
of-template
​
Disabled
Is it disabled
Boolean
false
Forms - Previous
Select
Next - Forms
Typeahead
Last modified
4yr ago
Copy link
Contents
Importing
How to use
API
Options API