Javascript 将表单填充到模板URL中，以便与ngMessages一起使用

我不熟悉棱角分明的人，也不习惯尝试指令

我希望能够使用

<div ng-messages="form.$error">
    <div ng-message="required">You did not enter a field</div>
</div>

您没有输入字段

在这样的自定义指令中

<div class="form-group">
    <label class="form-label" for="s-input-{{name}}">
        {{text.human}}
        <span ng-if="text.subtext" class="form-hint">{{text.subtext}}</span>
    </label>

    <select ng-required="required" ng-model="model" class="form-control"  id="s-input-{{name}}" name="{{name}}" ng-options="t for t in text.select"></select>
    <div ng-messages="form.$error">
        <div ng-message="required">You did not enter a field</div>
    </div>
</div>

{{text.human}
{{text.subtext}}
您没有输入字段

我可以通过使用指令元素下方的ng消息来让它工作，但不在其中。

尽管我真的不知道如何将表单传递到模板，以便ng消息可以访问它

我已经设置了一个plunker来向你展示我的裸体设置

我知道我需要带有

require:'^form'，

的表单，尽管我不确定如何在模板URL中使用/access

---

我头痛了一段时间了，所以我真的很感谢你的帮助！谢谢。

当您需要带有

require:“^form”

的form指令时，您可以在

链接中访问该FormController。然后，您可以简单地将该控制器连接到指令的作用域，如下所示：

link: function(scope, element, attributes, formController) {
    scope.form = formController;
}

然后在模板中引用它：

<div ng-messages="form.$error">
    <div ng-message="required">You did not enter a field</div>
</div>


您没有输入字段
当您需要带有
require:“^form”
的form指令时，您可以在
链接中访问该FormController。然后，您可以简单地将该控制器连接到指令的作用域，如下所示：

link: function(scope, element, attributes, formController) {
    scope.form = formController;
}

然后在模板中引用它：

<div ng-messages="form.$error">
    <div ng-message="required">You did not enter a field</div>
</div>


您没有输入字段
您可以随时将表单传递给您的指令

javascript

app.directive('selectGov', function (){ 
   return {
        restrict: 'E',
        templateUrl: 'select.html',
        scope: {
            text: "=?",
            model: "=",
            required: "=",
            selectItems: "=?",
            name: "@?",
            form: "="
        },
    };
});

html

<select-gov model="person.phoneNumberType" text="q.phoneType" required="true" name="phoneType" form="myForm"></select-gov>

您可以随时将表单传递给您的指令

javascript

app.directive('selectGov', function (){ 
   return {
        restrict: 'E',
        templateUrl: 'select.html',
        scope: {
            text: "=?",
            model: "=",
            required: "=",
            selectItems: "=?",
            name: "@?",
            form: "="
        },
    };
});

html

<select-gov model="person.phoneNumberType" text="q.phoneType" required="true" name="phoneType" form="myForm"></select-gov>


所以我在plunk中尝试过，但无法使其工作，我是否遗漏了什么？我以前试过这种方法。您的require是一个数组，因此您可以使用
scope.form=form[0]
或将require更改为
require:“^form”
，以使其正常工作。啊哈，就是这样！真不敢相信我会那么傻谢谢你的帮助！所以我试过了，但是我不能让它工作，我错过了什么吗？我以前试过这种方法。您的require是一个数组，因此您可以使用
scope.form=form[0]
或将require更改为
require:“^form”
，以使其正常工作。啊哈，就是这样！真不敢相信我会那么傻谢谢你的帮助！是的，我确实尝试过这个，尽管由于有很多这样的指令，必须不断地将表单添加到指令中似乎有点静态/浪费代码。但是是的，我同意这很好，但不适合我所想的情况。不，JC的答案更好。是的，我尝试过这个，虽然由于有很多这样的指令，必须不断地将表单添加到指令中似乎有点静态/浪费代码。但是，是的，我同意这样做很好，但不适合我所想的情况。不，JC的答案要好得多。