含有ng-include到html templateUrl的Angular Directive没有显示错误消息

Question

如果我将此html / angular / css代码排成一行并单击“提交请求”按钮，则会以红色突出显示并正确显示错误消息

<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>
        <lcd-code lcdcode="{{ detail.program.lcdCode }}"></lcd-code>

        <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 class="form-group-sm">
        <div class="col-md-5">
            <span ng-messages="orderDetailsForm.CustomerNameKey.$error" ng-if="(orderDetailsForm.CustomerNameKey.$invalid && orderDetailsForm.CustomerNameKey.$touched) || (orderDetailsForm.CustomerNameKey.$invalid && vmRequest.submittingRequest)">
                <span ng-message="required" class="label label-danger">Customer Name Key is required.</span>
            </span>
        </div>
    </div>
    <div class="col-md-2">

    </div>
</div>

现在，如果我输入自定义Directive

并将此代码替换为此

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

该指令将使用相同代码的html模板调用ng-include。但是现在，如果我单击提交按钮，则错误处理不起作用，

这是DOM的摘要周期的Angular加载的一部分，并且知道需要做什么＆＃34;观看＆＃34;

我该如何解决这个问题？

指令

(function () {

    var injectParams = ['customerService', '$sce'];

    var lcdCode = function (customerService, $sce) {
        return {
            replace: true,
            restrict: "E",
            scope: {
                lcdcode: '@'
            },
            //template: '<div ng-bind-html="content"></div>', //'<div>blah</div>',
            link: function (scope, element, attrs) {
                var promise = customerService.getKey(attrs.lcdcode)
                    .then(function (result) {
                        //scope.content = result;

                        //scope.content = $sce.trustAsHtml(blah);
                        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;
                        }

                        //console.log('scope.content', scope.content);
                    })
                    .catch(function () {
                        console.log('problem');
                    });

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

    lcdCode.$inject = injectParams;

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

}()); 

最相关的部分是

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

调用并加载我粘贴的确切html div结构

  scope.url = '/app/request/templates/keyRequired.html?v=1';