2016-06-15 4 views
1

Mein Winkel Schema Form die Inline-glyphicons Verlegt werden sie auf der rechten oberen Ecke der Seite anstelle gezeigt: picMisplaced glyphicons auf Winkel-Schema-Form

wurde mit Yeoman Diese App gebaut, mit Generator-Winkel .

html:

<div class="login-container"> 
    <form name="myForm" 
     sf-schema="schema" 
     sf-form="form" 
     sf-model="model" 
     ng-submit="onSubmit(myForm)"></form> 
</div> 

ts:

angular.module('playgroundApp') 
.controller('FormCtrl', ['$scope', function($scope) { 
    $scope.schema = { 
    "type": "object", 
    "title": "Types", 
    "properties": { 
     "string": { 
     "type": "string", 
     "minLength": 3 
     }, 
     "integer": { 
     "type": "integer" 
     }, 
     "number": { 
     "type": "number" 
     }, 
     "boolean": { 
     "type": "boolean" 
     } 
    }, 
    "required": [ 
     "number" 
    ] 
    }; 

    $scope.form = [ 
    "*", 
    { 
     "type": "submit", 
     "title": "OK" 
    } 
    ]; 

    $scope.model = {}; 

    $scope.onSubmit = function(form) { 
    // First we broadcast an event so all fields validate themselves 
    $scope.$broadcast('schemaFormValidate'); 

    // Then we check if the form is valid 
    if (form.$valid) { 
     // ... do whatever you need to do with your data. 
    } 
    } 
}]); 

ich für Konflikte zwischen den Richtlinien zu suchen versucht, leider konnte ich nicht das Verhalten in einer plunkr reproduzieren.

bower.json:

{ 
    "name": "playground", 
    "version": "0.0.0", 
    "dependencies": { 
    "angular": "^1.5.3", 
    "bootstrap": "^3.2.0", 
    "angular-animate": "^1.3.0", 
    "angular-cookies": "^1.3.0", 
    "angular-resource": "^1.3.0", 
    "angular-route": "^1.3.0", 
    "angular-sanitize": "^1.3.0", 
    "angular-touch": "^1.3.0", 
    "angular-ui-grid": "~3.1.1", 
    "angular-ui-router": "~0.2.15", 
    "ngstorage": "~0.3.9", 
    "angular-ui-layout": "~1.3.0", 
    "angular-bootstrap": "~0.14.3", 
    "moment": "~2.10.6", 
    "lodash": "~3.10.1", 
    "angular-wizard": "~0.5.5", 
    "ui-select": "angular-ui-select#~0.16.0", 
    "select2": "~3.4.5", 
    "angular-flash-alert": "~2.2.5", 
    "angular-gantt": "^1.2.13", 
    "angular-strap": "^2.3.7", 
    "angular-schema-form": "~0.8.13", 
    "angular-ui-tree": "~2.15.0", 
    "components-font-awesome": "~4.6.1", 
    "woodman": "~1.1.0", 
    "angular-ui-bootstrap": "~1.0.3", 
    "angular-picklist": "*", 
    "jquery-ui": "~1.11.4", 
    "angular-schema-form-bootstrap": "~0.2.0", 
    "angular-schema-form-datepicker": "~0.4.0", 
    "jquery": "~3.0.0" 
    }, 
    "devDependencies": { 
    "angular-mocks": "^1.3.0", 
    "ui-select": "angular-ui-select#~0.16.0" 
    }, 
    "appPath": "app", 
    "moduleName": "playgroundApp", 
    "overrides": { 
    "bootstrap": { 
     "main": [ 
     "less/bootstrap.less", 
     "dist/css/bootstrap.css", 
     "dist/js/bootstrap.js" 
     ] 
    } 
    }, 
    "resolutions": { 
    "lodash": "~3.10.1", 
    "angular-mocks": "^1.3.0" 
    } 
} 

Update: Ignoriert dieses Problem für 4 Monate. Heute habe ich die neuesten Versionen von angular-schema-form und angular-schema-form-bootstrap installiert und die Probleme waren weg.

+0

Klicken Sie mit der rechten Maustaste und überprüfen Sie das Element in den F12-Entwicklungstools, um festzustellen, ob Probleme mit der CSS auftreten. –

Antwort

0

Für alle, die immer noch Probleme mit diesen Symbolen haben, ist es möglich, sie zu jedem Feld in der Formulardefinition zu deaktivieren: 'feedback': false wie in der Dokumentation here angegeben.

Vielleicht nicht die beste Lösung, aber wird helfen, wenn Sie ohne die Symbole leben können.

Verwandte Themen