使用ngMessage无效的自定义指令

时间:2016-03-14 09:46:38

标签: javascript angularjs json directive ng-messages

**更新:**
这是展示我的问题的一个方面 https://plnkr.co/edit/3U7MHlJw0gcEdwT4e64r?p=preview
我确信我做错了。

我正在构建一个包含标签,输入和ng-messages的可重用元素指令。 属性的数据都存储在我使用$ http服务获得的Json对象中。

最后,我得到了标签的动态数据,输入属性和ng模型。 ng-messages,ng-messages-include正在运行,但......

我无法使用ng-messages-exp。

以下是一些希望有助于解释此问题的代码:

JSON:

[
    {
        "inputsContact" : [
            { 
                "labelText" : "test Name",
                "labelId" : "testname",
                "labelName" : "testname",
                "inputId" : "testname",
                "inputName" : "testname",
                "placeholder" : "Enter your name",
                "model" : "testname",
                "type" : "text",
                "required" : "true",
                "messageDirty" : "jiraForm.testname.$dirty",
                "messageError" : "jiraForm.testname.$error",
                "messageInclude" : "app/views/partials/messages/messages-error-text.html"
            }
        ]
    }
]

服务:

.factory('BuildInputService', ['$http',  function($http) {
    return {
        getInputs: function( callback ) {
            $http.get('app/data/input-creation-data.json')
            .then(function(response) {
                callback( response );
            });
        }
    };
}])

Html指令元素:

<text-input-comp input-data="testName" model-data="ticketData[testName.model]" message-data="errorMessages" message-dirty="jiraForm[testname].$dirty" message-error="jiraForm[testname].$error" message-include-url="testName[messageInclude]" class="input-group form-group"></text-input-comp>

--- ticketData是创建的表单数据

指令代码:

.directive('textInputComp', [ '$compile', function($compile){
  return {
    restrict: 'E',
    require: 'territoryController',
    scope: {
      inputData: '=',
      modelData: '=',
      messageData: '=messageData',
      messageDirty: '=messageDirty',
      messageError: '=messageError',
      messageIncludeUrl: '=messageIncludeUrl'
    },
    templateUrl: '/app/views/partials/components/textInputComp.html'
  }
}]);

指令中使用的模板: (我使用Laravel作为后端,因此我将{{}}替换为&lt; %%&gt;)

<label name="<% inputData.labelName %>" id="<% inputData.labelId %>" for="" class="control-label label-top" > <% inputData.labelText %> </label> 
<input name="<% inputData.inputName %>" id="<% inputData.inputId %>" class="form-control" type="text" ng-model="modelData" placeholder="<% inputData.placeholder %>" asteriskcheck ng-required="<% inputData.required %>"/> 
<div ng-messages="messageDirty" class="error-list" role="alert">
    <div ng-messages-include src="<% inputData.messageInclude %>"></div>
</div>

这是ng-messages-include

使用的模板
<div ng-repeat="errorMessage in messageData[0].text">
    <p ng-message-exp="errorMessage.type">
         <% errorMessage.text %>
    </p>
</div>

这是停止工作的地方,ng-repeat正在生成元素,但ng-message-exp不能用于我尝试的任何内容。

有没有人有这方面的解决方案? 我做错了什么?

非常感谢

0 个答案:

没有答案