2015-02-23 1 views
4

Я пытаюсь создать тип сценария text/ng-template, чтобы поместить мой шаблон сообщений об ошибках в $ templateCache. Я хочу, чтобы этот файл сценария был удаленным, в его собственном файле за пределами HTML.AngularJS ng-template с ng-messages-include

<script type="text/ng-template" id="error-messages"> 
    <span ng-message="required">This field is required.</span> 
    <span ng-message="min">This number must be larger than {{min}}.</span> 
    <span ng-message="max">This number must be smaller than {{max}}.</span> 
    <span ng-message="number">A number is required.</span> 
    <span ng-message="date">A date is required.</span> 
</script> 

Тогда в HTML Я хочу, чтобы ссылаться на этот шаблон, который я считаю, должен быть в $ templateCache и я могу получить доступ к этому Id.

<form name="userForm">  
     <div class="form-group"> 
     <label for="requiredInput">Required</label> 
     <input type="text" class="form-control" id="required" name="requiredInput" 
     ng-model="user.required" required /> 
     <div ng-messages="userForm.requiredInput.$error" ng-messages-include="error-messages"></div> 
     </div> 
</form> 

Если я поставил скрипт встроенный с HTML, он работает отлично, но я хочу, чтобы он находился в удаленном файле. Когда я переношу его в удаленный файл, мой HTML не может найти мои сообщения об ошибках шаблона.

Это мой первый плункер, которым я делюсь. Пожалуйста, дайте мне знать, если вы не можете добраться до него. http://plnkr.co/edit/NgSm7piaECWBab1LOmp3?p=preview

+1

, если он удален, нет необходимости в теге скрипта, хранить в виде файла html – charlietfl

+0

Благодарим вас за быстрый ответ. Я надеялся сохранить его в теге скрипта, который встраивается в процесс minify/uglify. Вместо использования ng-message-include = "app/module/feature1/errorMessages.html" я хотел, чтобы это было простое сообщение ng-message-include = "error-messages" только идентификатор шаблона. – Harbinger

+0

хорошо, вы не можете иметь его в обоих направлениях, если угловой не находит идентификатор, он делает запрос ajax, который потерпит неудачу, если путь недействителен. – charlietfl

ответ

12

Пожалуйста, проверьте plunker - http://plnkr.co/edit/luhUuZURCOeHSuEhi11x?p=info

angular.module('app', ['ngMessages']) 
.run(function ($templateCache, $http) { 
    $http.get('scriptTemplate.html') 
    .then(function(response) { 
    $templateCache.put('error-messages', response.data); 
    }) 
}) 

зарядите нг-сообщения, включают в себя шаблон, используя $ HTTP на этапе выполнения приложения и сохранить его в templateCache.

+0

Спасибо, я пошел по пути $ templateCache, чтобы получить желаемый результат. Хорошее использование обещания тоже :-) – Harbinger

+1

Это не работает. Или я что-то упускаю. – Eugene

+0

Хорошее решение, также я предпочитаю использовать этот метод, так как я могу повторно использовать идентификатор шаблона, всякий раз, когда изменяется путь к сообщениям (во время разработки мы все знаем, что это может произойти) вам нужно только изменить его в одном месте :) –

Смежные вопросы