Question

＆＃13;

<html>

<head>
<script type="text/javascript" src="bower_components/angular/angular.min.js"></script>
<script type="text/javascript" src="bower_components/angular-sanitize/angular-sanitize.min.js"></script>
<script type="text/javascript" src="bower_components/tv4/tv4.js"></script>
<script type="text/javascript" src="bower_components/objectpath/lib/ObjectPath.js"></script>
<script type="text/javascript" src="bower_components/angular-schema-form/dist/schema-form.min.js"></script>
<script type="text/javascript" src="bower_components/angular-schema-form/dist/bootstrap-decorator.min.js"></script>



</head>

<body ng-app="test" ng-cloak>

  

<div ng-controller="FormController">
    <form name="myForm"
          sf-schema="schema"
          sf-form="form"
          sf-model="model"
          ng-submit="onSubmit(myForm)"></form>
</div>



<script type="text/javascript">

angular.module('myModule', ['schemaForm']);


angular.module('myModule', ['schemaForm'])
       .controller('FormController', function($scope) {
  $scope.schema = {
    type: "object",
    properties: {
      name: { type: "string", minLength: 2, title: "Name", description: "Name or alias" },
      title: {
        type: "string",
        enum: ['dr','jr','sir','mrs','mr','NaN','dj']
      }
    }
  };

  $scope.form = [
    "*",
    {
      type: "submit",
      title: "Save"
    }
  ];

  $scope.model = {};
});



//Submit code
function FormController($scope) {
  $scope.schema = {
    type: "object",
    properties: {
      name: { type: "string", minLength: 2, title: "Name", description: "Name or alias" },
      title: {
        type: "string",
        enum: ['dr','jr','sir','mrs','mr','NaN','dj']
      }
    }
  };

  $scope.form = [
    "*",
    {
      type: "submit",
      title: "Save"
    }
  ];

  $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) {
        alert('submitted!');
      // ... do whatever you need to do with your data.
    }
  }
}

</script>
</body>








</html>

＆＃13;

我正在尝试按照快速入门指南启动并运行，但我似乎没有取得任何成功。我遵循了指南;

https://github.com/json-schema-form/angular-schema-form

所有包括在那里。但是我进入了控制台。

angular.js:38 Uncaught Error: [$injector:modulerr] 
  http://errors.angularjs.org/1.6.4/$injector/modulerr?p0=test&p1=Error%3A%20…gular-schema-form%2Fbower_components%2Fangular%2Fangular.min.js%3A22%3A179)
at angular.js:38
at angular.js:4920
at q (angular.js:403)
at g (angular.js:4880)
at eb (angular.js:4802)
at c (angular.js:1914)
at Sc (angular.js:1935)
at ue (angular.js:1820)
at angular.js:33367
at HTMLDocument.b (angular.js:3431)

角度新手，所以这对我来说都是新手！看到一些SO问题，但没有完整的工作示例。

Answer 1

好的，我已经解决了这个问题。似乎角度没有正确初始化。

ng-app="test"

应该是

ng-app="myModule"

我还提取了提交部分的重复代码。快速入门假设一个人知道角度并输入正确的ng-app标签，完整代码如下......

<html>

<head>
<script type="text/javascript" src="bower_components/angular/angular.min.js"></script>
<script type="text/javascript" src="bower_components/angular-sanitize/angular-sanitize.min.js"></script>
<script type="text/javascript" src="bower_components/tv4/tv4.js"></script>
<script type="text/javascript" src="bower_components/objectpath/lib/ObjectPath.js"></script>
<script type="text/javascript" src="bower_components/angular-schema-form/dist/schema-form.min.js"></script>
<script type="text/javascript" src="bower_components/angular-schema-form/dist/bootstrap-decorator.min.js"></script>



</head>

<body ng-app="myModule" ng-cloak>

  

<div ng-controller="FormController">
    <form name="myForm"
          sf-schema="schema"
          sf-form="form"
          sf-model="model"
          ng-submit="onSubmit(myForm)"></form>
</div>



<script type="text/javascript">

angular.module('myModule', ['schemaForm']);


angular.module('myModule', ['schemaForm'])
       .controller('FormController', function($scope) {
  $scope.schema = {
    type: "object",
    properties: {
      name: { type: "string", minLength: 2, title: "Name", description: "Name or alias" },
      title: {
        type: "string",
        enum: ['dr','jr','sir','mrs','mr','NaN','dj']
      }
    }
  };

  $scope.form = [
    "*",
    {
      type: "submit",
      title: "Save"
    }
  ];

  $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) {
        alert('submitted!');
      // ... do whatever you need to do with your data.
    }
  }
});



  


</script>
</body>








</html>

AngularJS Schema Form快速入门

1 个答案: