Skip to content

Commit ca38bbe

Browse files
subaa1492subaa1492
authored
Added getting started sample for dropdownlist
1 parent dbfa1a2 commit ca38bbe

20 files changed

+8836
-25
lines changed

‎README.md‎

Lines changed: 14 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,27 @@
1-
# Create an Angular Dropdown List Using Angular CLI
1+
# AngularDropdownlist
22

3-
A quick start Angular project that shows how to add the Syncfusion Angular Dropdown List to an Angular application. This project also includes a code snippet to populate JSON data and remote data sources, how to sort the data items and how to set a custom height and width for the Dropdown List pop-up.
3+
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 13.2.0.
44

5-
Examples: https://ej2.syncfusion.com/angular/demos/#/material/drop-down-list/default
6-
7-
Documentation: https://ej2.syncfusion.com/angular/documentation/drop-down-list/getting-started/
5+
## Development server
86

9-
# Project pre-requisites
7+
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
108

11-
Make sure that you have the compatible versions of TypeScript and Angular in your machine before starting to work on this project.
9+
## Code scaffolding
1210

13-
Angular 4+
14-
TypeScript 2.6+
11+
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
1512

16-
# How to run this application?
13+
## Build
1714

18-
To run this application, you need to first clone the create-an-angular-dropdown-list-using-angular-cli repository and then navigate to its appropriate path where it has been in your system.
15+
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
1916

20-
To do so, open the command prompt and run the below commands one after the other.
17+
## Running unit tests
2118

22-
git clone https://github.com/SyncfusionExamples/create-an-angular-dropdown-list-using-angular-cli dropdownlist-example
19+
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
2320

24-
cd dropdownlist-example
21+
## Running end-to-end tests
2522

26-
# Installing
23+
Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
2724

28-
Once done with downloading, next you need to install the necessary packages required to run this application locally. The npm install command will install all the needed angular packages into your current project and to do so, run the below command.
29-
30-
npm install
31-
32-
# Running on development server
33-
34-
Run ng serve command for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
35-
36-
# Further help
37-
To get more help on the Angular CLI use ng help or go check out the Angular CLI README.
25+
## Further help
3826

27+
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.

‎angular.json‎

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"cli": {
4+
"analytics": "59c4793e-4c68-46b1-819d-36f348b6a08b"
5+
},
6+
"version": 1,
7+
"newProjectRoot": "projects",
8+
"projects": {
9+
"angular-dropdownlist": {
10+
"projectType": "application",
11+
"schematics": {
12+
"@schematics/angular:application": {
13+
"strict": true
14+
}
15+
},
16+
"root": "",
17+
"sourceRoot": "src",
18+
"prefix": "app",
19+
"architect": {
20+
"build": {
21+
"builder": "@angular-devkit/build-angular:browser",
22+
"options": {
23+
"outputPath": "dist/angular-dropdownlist",
24+
"index": "src/index.html",
25+
"main": "src/main.ts",
26+
"polyfills": "src/polyfills.ts",
27+
"tsConfig": "tsconfig.app.json",
28+
"assets": [
29+
"src/favicon.ico",
30+
"src/assets"
31+
],
32+
"styles": [
33+
"src/styles.css"
34+
],
35+
"scripts": []
36+
},
37+
"configurations": {
38+
"production": {
39+
"budgets": [
40+
{
41+
"type": "initial",
42+
"maximumWarning": "500kb",
43+
"maximumError": "1mb"
44+
},
45+
{
46+
"type": "anyComponentStyle",
47+
"maximumWarning": "2kb",
48+
"maximumError": "4kb"
49+
}
50+
],
51+
"fileReplacements": [
52+
{
53+
"replace": "src/environments/environment.ts",
54+
"with": "src/environments/environment.prod.ts"
55+
}
56+
],
57+
"outputHashing": "all"
58+
},
59+
"development": {
60+
"buildOptimizer": false,
61+
"optimization": false,
62+
"vendorChunk": true,
63+
"extractLicenses": false,
64+
"sourceMap": true,
65+
"namedChunks": true
66+
}
67+
},
68+
"defaultConfiguration": "production"
69+
},
70+
"serve": {
71+
"builder": "@angular-devkit/build-angular:dev-server",
72+
"configurations": {
73+
"production": {
74+
"browserTarget": "angular-dropdownlist:build:production"
75+
},
76+
"development": {
77+
"browserTarget": "angular-dropdownlist:build:development"
78+
}
79+
},
80+
"defaultConfiguration": "development"
81+
},
82+
"extract-i18n": {
83+
"builder": "@angular-devkit/build-angular:extract-i18n",
84+
"options": {
85+
"browserTarget": "angular-dropdownlist:build"
86+
}
87+
},
88+
"test": {
89+
"builder": "@angular-devkit/build-angular:karma",
90+
"options": {
91+
"main": "src/test.ts",
92+
"polyfills": "src/polyfills.ts",
93+
"tsConfig": "tsconfig.spec.json",
94+
"karmaConfig": "karma.conf.js",
95+
"assets": [
96+
"src/favicon.ico",
97+
"src/assets"
98+
],
99+
"styles": [
100+
"src/styles.css"
101+
],
102+
"scripts": []
103+
}
104+
}
105+
}
106+
}
107+
},
108+
"defaultProject": "angular-dropdownlist"
109+
}

‎karma.conf.js‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
// Karma configuration file, see link for more information
2+
// https://karma-runner.github.io/1.0/config/configuration-file.html
3+
4+
module.exports = function (config) {
5+
config.set({
6+
basePath: '',
7+
frameworks: ['jasmine', '@angular-devkit/build-angular'],
8+
plugins: [
9+
require('karma-jasmine'),
10+
require('karma-chrome-launcher'),
11+
require('karma-jasmine-html-reporter'),
12+
require('karma-coverage'),
13+
require('@angular-devkit/build-angular/plugins/karma')
14+
],
15+
client: {
16+
jasmine: {
17+
// you can add configuration options for Jasmine here
18+
// the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
19+
// for example, you can disable the random execution with `random: false`
20+
// or set a specific seed with `seed: 4321`
21+
},
22+
clearContext: false // leave Jasmine Spec Runner output visible in browser
23+
},
24+
jasmineHtmlReporter: {
25+
suppressAll: true // removes the duplicated traces
26+
},
27+
coverageReporter: {
28+
dir: require('path').join(__dirname, './coverage/angular-dropdownlist'),
29+
subdir: '.',
30+
reporters: [
31+
{ type: 'html' },
32+
{ type: 'text-summary' }
33+
]
34+
},
35+
reporters: ['progress', 'kjhtml'],
36+
port: 9876,
37+
colors: true,
38+
logLevel: config.LOG_INFO,
39+
autoWatch: true,
40+
browsers: ['Chrome'],
41+
singleRun: false,
42+
restartOnFileChange: true
43+
});
44+
};

0 commit comments

Comments
 (0)