1

我的角度模式表单错位了内联字形图标，它们显示在页面的右上角： pic

这个应用程序是用 yeoman 构建的，使用 generator-angular。

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.
    }
  }
}]);

我试图搜索指令之间的冲突，不幸的是我无法重现plunkr中的行为。

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"
  }
}

更新：忽略这个问题 4 个月。今天面对它，我安装了最新版本的 angular-schema-form 和angular-schema-form-b​​ootstrap，问题就消失了。

4

1 回答 1

0

对于那些仍然有这些图标问题的人，可以禁用它们添加到表单定义中的每个字段：如此处'feedback': false的文档中所述。

也许不是最好的解决方案，但如果您可以在没有图标的情况下生活，将会有所帮助。

于 2017-02-03T12:49:17.407 回答