https://github.com/damingerdai/daming-select

a single select control like material design
https://github.com/damingerdai/daming-select

Last synced: 19 days ago
JSON representation

a single select control like material design

• Host: GitHub
• URL: https://github.com/damingerdai/daming-select
• Owner: damingerdai
• License: mit
• Created: 2019-06-07T14:14:06.000Z (over 5 years ago)
• Default Branch: develop
• Last Pushed: 2023-02-27T14:07:36.000Z (almost 2 years ago)
• Last Synced: 2023-03-02T13:41:22.425Z (almost 2 years ago)
• Language: TypeScript
• Homepage: https://damingerdai.github.io/daming-select
• Size: 2.38 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 29
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Daming Select

![.github/workflows/deploy.yml](https://github.com/damingerdai/daming-select/workflows/.github/workflows/deploy.yml/badge.svg?branch=master&event=push)

基于Angular的类Material Designs的下拉框，

> 本项目使用[Angular CLI](https://github.com/angular/angular-cli) 7.3.6版本创建。

# 安装

目前该代码尚未上传npm，不支持在线安装

# 使用

## 第一步

引入SelectModule，以AppModule为例:

```ts

...

import { SelectModule } from 'select';

@NgModule({

  declarations: [

    AppComponent

  ],

  imports: [

    BrowserModule,

    SelectModule,

		...

  ],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }

```

## 第二步

在组件中使用:

```html

    {{option.name}}

```

```ts

import { Component } from '@angular/core';

import { FormBuilder, FormGroup, Validators } from '@angular/forms';

const OPTIONS = [

  {

    value: 'daming',

    name: 'daming'

  },

  {

    value: 'xiao2',

    name: 'xiao2'

  }

];

@Component({

	...

})

export class AppComponent {

	...

  options = OPTIONS;

  form: FormGroup;

  damingForm: FormGroup;

  selectedValue: string;

  get defaultValue() {

    return this.form.get('defaultValue');

  }

  get formValid() {

    return this.form.valid;

  }

  constructor(

    private fb: FormBuilder

  ) {

    this.form = fb.group({

      defaultValue: ['', [Validators.required]]

    });

    this.damingForm = fb.group({

      selectValue: []

    });

  }

}

```

## 说明

该项目需要@angular/material和@angular/cdk的支持

# 所有者

[@大明二代](https://github.com/damingerdai)

# License

[MIT](LICENSE) © 大明二代

# 示例

[GitHub](https://damingerdai.github.io/daming-select)