Question

HTML，因为放在指令

中有效

<div class="col-md-12" style="margin-top: 5px;">
    <div class="form-group-sm" ng-class="{'has-error': (orderDetailsForm.CustomerNameKey.$invalid && orderDetailsForm.CustomerNameKey.$touched) || (orderDetailsForm.CustomerNameKey.$invalid && vmRequest.submittingRequest)}">
        <label class="col-md-2 control-label text-nowrap">Customer Name Key:</label>

        <div class="col-md-3" ng-class="{'has-error': (orderDetailsForm.CustomerNameKey.$invalid && orderDetailsForm.CustomerNameKey.$touched) || (orderDetailsForm.CustomerNameKey.$invalid && vmRequest.submittingRequest)}">
            <input replace="[^a-zA-Z]" with="" maxlength="4" type="text" id="CustomerNameKey" name="CustomerNameKey" class="form-control" ng-model="detail.customerNameKey" placeholder="Customer Name Key" required />
        </div>
    </div>
</div>

所以上面的工作。但是，我必须进行网络API呼叫，然后检查一下，看看是否要显示

因此，我有一个调用服务的指令，然后根据它，使用ng-include到正确的html模板。

我对指令的调用

 <div ng-if="detail.program.ldcCode.length > 0">
     <lcd-code lcdcode="{{ detail.program.ldcCode }}"></lcd-code>
</div>

指令

(function () {

    var lcdCode = function (customerService) {
        return {
            replace: true,
            restrict: "E",
            scope: {
                lcdcode: '@'
            },
            link: function (scope, element, attrs) {
                var promise = customerService.getKey(attrs.lcdcode)
                    .then(function (result) {

                        scope.url = "";

                        scope.getContentUrl = function () {
                            if (result === 1) {
                                scope.url = '/app/request/templates/keyRequired.html?v=1';
                            } else {
                                scope.url = '/app/request/templates/empty.html?v=1';
                            }
                            return scope.url;
                        }

                    })
                    .catch(function () {
                        console.log('problem');
                    });

            },
            template: '<div ng-include="getContentUrl()"></div>'

        };
    };

    angular.module('app').directive('lcdCode', lcdCode)

}());

我阅读并尝试的是传递表格

所以我尝试用HTML传递

中的表单

<lcd-code orderDetailsForm="orderDetailsForm" lcdcode="{{ detail.program.ldcCode }}"></lcd-code>

表格

中的指令传递中的下一步

orderDetailsForm: '=',

我使用了该名称orderDetailsForm，因为keyRequired.html模板已经具有类似

的值

ng-messages="orderDetailsForm.CustomerNameKey.$error"

所以我阅读并尝试传递形式，查看链接和编译器的东西 - 我不确定是什么问题

NgMessage不在Angular Directive中工作

0 个答案: