2017-01-18 5 views
0

Примечание: Я изменяю этот пост после того, как получил больше опыта работы с Angular и Java. Это делается для того, чтобы не публиковать новый вопрос.Использование тега JSP C в коде AngularJS

В течение последних нескольких месяцев, работая с различными моделями для реализации многоразовых частей AngularJS в коде JSP, в конце концов решил использовать директиву jsp include <%@include file="form-part.jsp" %>. Это хорошо работает, и единственная проблема теперь - проблема читаемости при использовании C Tags.

Например, переменные определены в файле ресурсов Eclipse, следующим образом:

Resource File (.properties):

formhtml5.jsp.photoSubjectFront=Subject Front 
formhtml5.jsp.photoSubjectStreet=Subject Street 
formhtml5.jsp.photoSubjectRear=Subject Rear 

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

HTML в JSP файл

<fmt:message key="formhtml5.jsp.photoSubjectFront" scope="request" var="photoSubjectFront"/> 
<fmt:message key="formhtml5.jsp.photoSubjectStreet" scope="request" var="photoSubjectStreet"/> 
<fmt:message key="formhtml5.jsp.photoSubjectRear" scope="request" var="photoSubjectRear"/> 
... 
... 
<div class="photos-container" 
    ng-init="subjectPhotos = 
          [{fieldName:'subject_front', 
           title:'${photoSubjectFront}'}, 
          {fieldName: 'subject_street', 
           title: '${photoSubjectStreet}'}, 
          {fieldName: ''subject_rear, 
           title: '${photoSubjectRear}'} 
          ]"> 
... 
... 
</div> 

Если вы заметили, то указанный выше код HTML кода не очень читабельен.

Каков наилучший способ инициализации массива subjectPhotos переменной области и использовать переменную JSP ${photoSubjectFront} в инициализации?

Я думал, могу ли я сделать это в блоке <script>, который намного читабельнее, но я не был уверен в доступе к переменной области видимости внутри обычного блока сценария.

Цените свой отзыв.

Old Post:

Я разработка форм приложений на основе использования Угловым в течение последних 3-4 месяцев. Я готов перейти к следующему этапу, чтобы преобразовать разработанную форму (HTML5 + Script) в компоненты или части, которые можно повторно использовать. Разработка была выполнена с использованием Eclipse, Java (JSP + Servlets) и, конечно, HTML5, JavaScript (Angular) и CSS.

В прошлом я успешно справился с использованием ASP.NET, мастер-страниц и пользовательских элементов управления.

Что я ищу - это способ создания модульных и многоразовых частей формы для HTML5 и Code, чтобы их можно было повторно использовать в другой форме, которая имеет ту же самую часть с возможными незначительными изменениями в макете и логике.

В настоящее время я делаю это, но только для кода. Мне удалось разработать Angular Directives, Services и Controllers, которые действительно оправдывают мои ожидания в отношении повторного использования. Единственная проблема заключается в том, как сделать HTML5 (макет) также многоразовым.

Я сделал некоторые исследования, и я могу перечислить некоторые варианты:

  1. рамки

    Использование Java на основе, которая аналогична ASP.NET Master Pages. Я нашел несколько вариантов.

  2. Использование угловых указателей и шаблонов. Проблема здесь в том, что вам нужно составить очень длинную строку, которая будет представлять часть HTML. Он считает, что это сбивает с толку. Я надеюсь, что есть способ сохранить повторно используемую HTML-часть в отдельном файле и включить ее в директиву или что-то в этом роде.

  3. Используйте JSP для разработки повторно используемой части и включите ее в основную форму. Я могу использовать директиву jsp include <%@include file="form-part.jsp" %>, чтобы включить часть многоразовой формы.

Я оцениваю возможные варианты, чтобы выбрать наиболее подходящий.

Надеюсь, вы можете указать мне на образец или учебник, которые помогут мне достичь этого требования.

Примечание: Я нашел хороший tutorial, который будет отличным стартом.

Цените свой отзыв.

Тарек

+0

Вместо ой HTML строка в 'template', вы можете предоставить путь т o ваш html-файл с использованием свойства 'templateUrl' в директиве/компоненте. – Developer

ответ

0

Если ваш разговор angular2 который теперь angularjs или angular.io использовать компонент.

посмотрите на использование углового-cli ng, создайте компонент yourform, чтобы сгенерировать начало компонента.

+0

Я решил не использовать Angular2, поскольку он еще не на 100% зрелый, и не так широко используется, и Angularjs. Кроме того, когда я начал изучать Angular2, это казалось более сложным, чем Angularjs. – tarekahf

1

Лучшим способом разработки многоразовой формы является директива, использующая html templateUrl. Вы, вероятно, с помощью «Шаблон» особенность

return { 
      replace: true, 
      templateUrl: 'some_form_template.html', 
      // template: '<div>Hello World</div>' 
} 

Когда речь заходит об использовании специального проверки вы также использовать директивы для создания валидаций: http://ng-learn.org/2014/02/Writing_Custom_Validitions/

Когда дело доходит до слабеющей ошибок, пожалуйста, используйте нг-сообщения/директивы нг-сообщение: https://docs.angularjs.org/api/ngMessages/directive/ngMessages

Этот вопрос уже asnwerd: How to create a angular input directive that works with form validation

+0

Спасибо! Да, 'templateUrl' определенно будет хорошим выбором. Было бы здорово, если бы вы могли указать мне на демонстрацию или образец, который реализует повторно используемые части формы с помощью 'templateUrl'. – tarekahf