我有这个 Angular
项目:
$ mkdir angular-material-select
$ cd angular-material-select
$ git clone git@github.com:napolev/angular-material-select.git .
$ npm install
$ ng serve
它使用了来自 Material Design
的 <mat-select />
.
原始示例:https://material.angular.io/components/select/overview#resetting-the-select-value
隔离示例:https://stackblitz.com/angular/qodvbqymxae
我的目标是使用组件: <mat-select />
与普通 Javascript
,而无需与 ng
一起服务: ng serve
. 我想用以下方式使用它:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<!-- BEGIN of {Angular, Material Design, etc.} dependencies -->
<link rel="stylesheet" type="text/css" href="..." />
<script type="text/javascript" src="..."></script>
<!-- END of {Angular, Material Design, etc.} dependencies -->
<script type="text/javascript">
// BEGIN OF Angular BLOCK
// ...
// ... (if necessary)
// ...
// END OF Angular BLOCK
</script>
</head>
<body>
<!-- ... -->
<mat-form-field>
<mat-select placeholder="State">
<mat-option>None</mat-option>
<mat-option *ngFor="let state of states" [value]="state">{{state}}</mat-option>
</mat-select>
</mat-form-field>
<!-- ... -->
</body>
</html>
我想要类似于这个工作示例的东西( Angular 1
):
实时代码:https://napolev.github.io/angular-material-select/datepicker.html
源代码:https://raw.githubusercontent.com/napolev/angular-material-select/master/datepicker.html