Question

我在我在angularjs中构建的表单上收到此错误。

`错误：[$ compile：multidir]多个指令[form，form]要求'form'控制器：

<div data-ng-controller="shortlistController">
    <ul>
        <li data-ng-repeat="job in jobs">
            <div>{{ job.role }}</div><div>{{ job.salary }}</div><div>{{ job.company }}</div>
        </li>
    </ul>
</div>

<form ng-form>
    <input type="text" ng-model="newRole">
    <input type="text" ng-model="newSalary">
    <input type="text" ng-model="newCompany">
    <input type="text" ng-model="newUrl">
    <button>Submit</button>
</form>

最初我在data-ng-controller中有表格，我拿出来看看控制器是否可能是问题..

请问您是否认为我需要发布更多代码，我正在使用angulars本地路由系统

Answer 1

如果您使用ng-form，则不需要<form>，因为它会自动连接到ng-form指令。你可以使用或者两者兼而有之。

Answer 2

这些中的每一个都或多或少相同，并且引用form指令：

<form></form>
<div form></div>
<div x-form></div>
<div data-form></div>

因此，您可以执行<div form></div>或简单<form></form>，在这两种情况下，它们都会引用相同的form指令。但<form form></form>将是多余的。

您提到的ngForm指令实际上是上面form指令的别名，可以使用以下任何一种来引用：

<ng-form></ng-form>
<div ng-form></div>
<div x-ng-form></div>
<div data-ng-form></div>

因此，在您的情况下，您正在执行<form ng-form></form>，这与<form form></form>非常相似，这就是您收到错误的原因。

此页面更详细地解释了引用指令的所有不同方法： http://docs.angularjs.org/guide/directive

顺便说一句，使用<div ng-form></div>格式的好处（有时）是您可以执行嵌套表单，而不能仅使用<form>标记来执行嵌套表单。

Answer 3

我将组件名称设置为form时遇到了同样的问题。

angular.module("testApp").component("form", {
   ...
});

效果与@ user553086答案类似。更改组件的名称可以解决问题。

错误：[$ compile：multidir]多个指令[form，form]要求'form'控制器：<form ng-form =“”> </form>

3 个答案: