2016-03-30 2 views
2

Ich möchte angular-formly benutzerdefinierte Vorlage für meine Anwendung implementieren. Ich möchte keine Bootstrap-Vorlage verwenden, da ich eine benutzerdefinierte UI/CSS-Bibliothek habe. Wie implementiere ich eine benutzerdefinierte Vorlage? Erhalte ich angular-formular-templates-vanilla oder angular-formula-templates-bootstrap und passe es an meine Bedürfnisse an. Derzeit implementiere ich eine Vorlage mit separaten HTML-Dateien wie unten, aber ich möchte die Vorlage wiederverwenden, also ist dies die beste Lösung?Wie man eckige Vorlage für benutzerdefinierte ui/css-Bibliothek zu implementieren?

angular 
     .module('myApp').run(function(formlyConfig) { 
     formlyConfig.setType([{ 
     name: 'input', 
     templateUrl: 'input.html', 
     overwriteOk: true 
     }, 
     { 
     name: 'select', 
     templateUrl: 'select.html', 
     overwriteOk: true 
     }]); 
    }); 

HTML-Dokument

input.html

<div class="custom-group"> 
    <label class="form-label" for="{{options.key}}"> 
    {{to.label}} 
    </label> 
    <input id="{{options.key}}" ng-model="model[options.key]" type="text"> 
</div> 

select.html

<div class="custom-group"> 
    <label class="form-label" for="{{options.key}}">{{to.label}}</label> 
    <span class="form-select-span"> 
    <select class="form-control" id="{{options.key}}" ng-model="model[options.key]" 
     ng-options="option.value as option.name group by option.group for option in options.templateOptions.options"> 
    </select> 
    </span> 
</div> 

Antwort

0

Warum gehst du nicht einfach ein Klassenname geben und dann einfach die CSS überschreiben? Sie versuchen, das Rad neu zu erfinden, wenn es nicht getan werden muss.

Verwandte Themen