django rest framework meets angular 5 material.io dynamic forms-快速开发创建和编辑对话框
django-angular-dynamic-forms的Python项目详细描述
此回购提供快速的Django混和和角度库。 为django rest框架开发创建/编辑对话框。 它取决于django 2、angular 6和material ui。
注：对Angular 5和Django<；2的支持未得到积极开发-使用 release/angular5 branch或1.1.*版本的包（如果需要）。
在django端，扩展Viewset以使用AngularFormMixin 并且可选地通过提供布局来配置MIXIN。 信息或字段默认值（如css类）。参见演示 详细情况。
classCityViewSet(AngularFormMixin,viewsets.ModelViewSet):""" API for cities """queryset=City.objects.all()serializer_class=CitySerializer
在角度方面，使用DjangoFormDialogService显示一个对话框：
constructor(privatedialog: DjangoFormDialogService){}createCity() {this.dialog.open('/api/1.0/cities/').subscribe(result=>{console.log('City created, result from server is:',result);});}
您还可以通过<django-inpage-form>标记在自己的组件中显示表单。
<django-inpage-formdjango_url="/api/1.0/cities/"(submit)="submit($event)"(cancel)="cancel($event)"></django-inpage-form>
安装
django边：
pip install django-angular-dynamic-forms
角度边：
npm install --save django-angular-dynamic-forms @ng-dynamic-forms/core @ng-dynamic-forms/ui-material
要呈现表单，此库使用https://github.com/udos86/ng-dynamic-forms-不要忘记 将其添加到package.json中。
并将DjangoFormModule添加到导入。你需要提供你自己的错误服务 返回给用户的通信错误。请参阅demo/angular/src/app/mat-error.service.ts以获取 一个示例实现。
import{DjangoFormModule,ErrorService}from'django-angular-dynamic-forms';@NgModule({declarations:[...],imports:[BrowserAnimationsModule,DynamicFormsCoreModule.forRoot(),DynamicFormsMaterialUIModule,DjangoFormModule,HttpClientModule,...],providers:[{provide: ErrorService,useClass: MatErrorService},],bootstrap:[AppComponent]})exportclassAppModule{}
配置
如果Angular和Django服务器位于同一主机/端口上（请参见 https://github.com/angular/angular-cli/blob/master/docs/documentation/stories/proxy.md关于开发技巧， 无需配置。
如果angular和django位于不同的主机/端口上，请设置django设置ANGULAR_FORM_ABSOLUTE_URLS=True（ 感谢@sssolid指出这一点）。
欢迎加入QQ群-->： 979659372
