Изображение галереи не отображается
0
Я хочу создать директиву масштабного всплывающего окна для фотогалереи. Моя идея создать директиву заключается в том, что выборка и отображение изображения галереи из базы данных по директиве hzphoto и одинаковые данные могут использоваться в директиве, поэтому я не требую второго вызова в базе данных.
Но я могу получить данные успешно в hzPhoto и создать массив данных в hzMagnificPopup успешно, но изображение не отображается в шаблоне.
следующий мой код.
Директива: hzPhotoDirective.js
hzphoto: получить всю фотографию из базы данных
hzImagepopup: получить запись по одному в цикле и сохранить в массиве, а позже я буду использовать для magnificpopup. Массив создан успешно, но изображение не отображается в шаблоне.
(function () {
'use strict';
angular
.module("AppSigma")
.directive("hzPhoto", [function () {
return{
restrict: "E",
replace: false,
template: "<div class=\"total_album_photo gallery\" ng-repeat=\"photo in list\"></div>",
scope: {
list: "="
},
link: function (scope, element, attrs) {
console.log("scope list in hzpohot");
console.log(scope);
}
}
}])
.directive('hzImagePopup', ["$rootScope", function ($rootScope) {
var arrData = [];
return{
restrict: "E",
//replace: true,
// template: "\n\
// <div class=\"no_of_photo imgWrapper\">\n\
// <a href=\"javascript:void(0);\" class=\"popup-link\" data-index=\"2\" data-ref=\"{{photo.photo_name}}\" data-module=\"photo\">\n\
// <img ng-src=\"/resize/photo/{{photo.photo_name}}\" height=\"120\" width=\"120\"/>\n\
// </a>\n\
// </div>\n\
//",
scope: {
list: "=",
link: "@"
},
compile: function (element, attrs) {
return{
pre: function (scope, element, attrs) {
console.log(scope.link);
var originalImage_img = scope.link + "/" + scope.list.photo_name;
arrData.push({originalImage_img: originalImage_img});
console.log(arrData);
}
}
}
}
}])
.directive('hzImagePopup1', ["$rootScope", "HzPhotoService", function ($rootScope, HzPhotoService) {
return{
restrict: "A",
scope: {
list: "="
},
compile: function (element, attrs) {
return{
pre: function (scope, element, attrs) {
var module = 'photo';
var data = [
{originalImage_img: "/photo/2e94ab78daa337e448880d71250c4ec6.png"},
{originalImage_img: "/photo/American-Brides-jewelry-Set-2015-Collection-For-Hot-Girls-3.jpg"},
{originalImage_img: "/photo/cda82455689274565b94de46dc08d486.jpg"}
];
var totalImage = data.length;
angular.forEach(angular.element(".imgWrapper > a"), function (val, key) {
console.log("index:" + angular.element(".popup-link").eq(key).data("index"));
angular.element(".popup-link").eq(key).magnificPopup({
key: 'my-popup',
items: data,
index: key,
type: 'inline',
verticalFit: true, // Fits image in area vertically
inline: {
// Define markup. Class names should match key names.
markup: "\n\
<form class=\"white-popup-block ng-pristine ng-valid ng-scope\" id=\"dataPopup\">\n\
<div class=\"popup_heading\">Photo 1 of 3</div>\n\
<div id=\"img_center\">\n\
<img style=\"width:100%\" src=\"\" id=\"img_center_content\" class=\"mfp-originalImage\">\n\
</div>\n\
<button class=\"mfp-close\" type=\"button\" title=\"Close (Esc)\">×</button>\n\
</form>\n\
"
},
gallery: {
enabled: true
},
callbacks: {
open: function () {
},
change: function () {
},
markupParse: function (template, values, item) {
// optionally apply your own logic - modify "template" element based on data in "values"
// console.log('Parsing:', template, values, item);
},
elementParse: function (item) {
}
}
});
});
}
}
},
link: function (scope, element, attrs) {
console.log("photoloads");
console.log($rootScope.photos);
}
};
}
]);
}());
PhotoCtrl.js
(function () {
'use strict';
/**
* Photo Controller for photo features
* @param {type} $scope
* @returns {undefined}
*/
function PhotoCtrl($scope, $state, HzServices) {
/**
* Lists available albums of user
* @returns {undefined}
*/
$scope.doAlbumList = function () {
var data = {params: {q: $state.params.pid}};
var deferred = HzServices.deferred("/api/album/list", data);
deferred.then(
function (res) {
$scope.albums = res.data.album;
$scope.albumsCount = res.data.album.length;
$scope.photos = res.data.photo;
$scope.photosCount = res.data.photo.length;
},
function (res) {
$scope.albums = {};
$scope.albumsCount = 0;
$scope.photos = {};
$scope.photosCount = 0;
});
};
$scope.doGetPhoto = function () {
return [{photos: $scope.photos, photoCount: $scope.photoCount}];
}
angular
.module("AppSigma")
.controller('PhotoCtrl', ['$scope', '$state', 'HzServices', PhotoCtrl]);
}());
Photo.html
<div class="total_album_photo gallery" ng-repeat="photo in photos track by $index">
<hz-image-popup list="photo" link="photo" data-index="{{$index}}"></hz-image-popup>
</div>
1 ответ
0
После двухдневных усилий я обнаружил свои ошибки, и я редактировал свой код. Я последовал ниже, чтобы решить проблему, и она отлично работает для создания динамической всплывающей галереи.
photo.html
/*
* To create directive for loop through all gallery photos.
*/
<div class="total_album_photo_gallery">
<hz-media-list photos="photos"></hz-media-list>
</div>
photoList.html
/*
* Here I can loop through all photos and display thumbnails of photos,
* ng-repeat-start and ng-repeat-stop to call directive in last photo,
* so it will not call directive through all photos loop
*/
<div>
<div class="total_album_photo gallery" ng-repeat-start="photo in photos track by $index">
<div class="no_of_photo imgWrapper">
<a href="javascript:void(0);" class="popup-link" data-index="{{$index}}">
<img ng-src="/resize/photo/{{photo.photo_name}}" height="120" width="120"/>
</a>
</div>
</div>
/*
* Create magnific popup directive to show photo gallery it will fetch photos directly.
*/
<div ng-repeat-end=""><hz-photo-popup></hz-photo-popup></div>
</div>
HzPhotoService.js
/*
* Create services to share common data to all directives.
*/
(function () {
'use strict';
angular
.module("AppSigma")
.factory("HzPhotoService", ['$rootScope', '$state', 'HzServices',
function ($rootScope, $state, HzServices) {
//$scope.sharedData = [];
return {
getPhotoData: function () {
var data = {params: {q: $state.params.pid}};
return HzServices.deferred("/api/album/list", data);
},
setSharedData: function (data) {
$rootScope.sharedData = data;
},
getSharedData: function () {
return $rootScope.sharedData;
}
}
}
]);
}());
Photoctrl.js
(function () {
'use strict';
/**
* Photo Controller for photo features
* @param {type} $scope
* @returns {undefined}
*/
function PhotoCtrl($rootScope, $scope, $state, HzServices, HzPhotoService) {
/**
* Lists available albums of user
* @returns {undefined}
*/
$scope.doAlbumList = function () {
var data = {params: {q: $state.params.pid}};
var deferred = HzServices.deferred("/api/album/list", data);
deferred.then(
function (res) {
var data = {album: {count: res.data.album.length, data: res.data.album}, photo: {count: res.data.photo.length, data: res.data.photo}};
HzPhotoService.setSharedData(data);
$scope.albums = $rootScope.sharedData.album.data;
$scope.albumsCount = $rootScope.sharedData.album.count;
$scope.photos = $rootScope.sharedData.photo.data;
$scope.photosCount = $rootScope.sharedData.photo.count;
},
function (res) {
$scope.albums = {};
$scope.albumsCount = 0;
$scope.photos = {};
$scope.photosCount = 0;
var data = {album: {count: $scope.albumsCount, data: $scope.albums}, photo: {count: $scope.photosCount, data: $scope.photos}};
HzPhotoService.setSharedData(data);
}
);
}
}
angular
.module("AppSigma")
.controller('PhotoCtrl', ['$rootScope', '$scope', '$state', 'HzServices', 'HzPhotoService', PhotoCtrl]);
}());
HzDirective.js
(function () {
'use strict';
angular
.module("AppSigma")
.directive("hzMediaList", [function () {
/*
* Photo thumbnail listing directive
*/
return {
restrict: "AE",
replace: true,
templateUrl: "/views/photo/photoList.html",
scope: {
photos: "="
}
}
}])
.directive("hzPhotoPopup", ["HzPhotoService", function (HzPhotoService) {
/*
* Magnific Popup directive
*/
return {
restrict: "AECM",
replace: true,
scope: true,
compile: function (scope, element) {
return{
pre: function (scope, element, attrs) {
if (scope.$last) {
var media = HzPhotoService.getSharedData();
var arrData = [];
angular.forEach(media.photo.data, function (value, key) {
arrData.push({originalImage_img: "/photo/" + value.photo_name});
});
angular.forEach(angular.element(".gallery > .imgWrapper > a"), function (val, key) {
angular.element(".popup-link").eq(key).magnificPopup({
key: 'my-popup',
items: arrData,
index: key,
type: 'inline',
verticalFit: true, // Fits image in area vertically
inline: {
// Define markup. Class names should match key names.
markup: "\n\
<form class=\"white-popup-block ng-pristine ng-valid ng-scope\" id=\"dataPopup\">\n\
<div class=\"popup_heading\">Photo</div>\n\
<div id=\"img_center\">\n\
<img style=\"width:100%\" src=\"\" id=\"img_center_content\" class=\"mfp-originalImage\">\n\
</div>\n\
<div class=\"popup_main\">\n\
<div class=\"popup_left photo_popup_left\">\n\
<div class=\"popup_raw1\">\n\
<div class=\"popup_raw1_left\">\n\
<div class=\" location\">Location: <span>Ahmedabad</span></div>\n\
<div class=\"comment_link\">\n\
<ul>\n\
<li><a href=\"#\"><i class=\"fa fa-heart\"></i>Like</a></li>\n\
</ul>\n\
</div>\n\
</div>\n\
<div class=\"popup_raw1_right\">\n\
<div class=\"latest-review-time\">3 months ago</div>\n\
<div class=\"clear\"></div>\n\
<div class=\"latest-review-time\">\n\
<div class=\"mgmenu_fixed mgmenu1\" id=\"mgmenu1\">\n\
<!-- Begin Mega Menu Container -->\n\
<ul ng-show=\"isAuth\" class=\"mgmenu\">\n\
<!-- Begin Mega Menu -->\n\
<li class=\"username-menu\">\n\
<div class=\"user_img_div\">\n\
<a style=\"padding-right:0px\" href=\"#\"><img src=\"images/dotimg.png\"></a>\n\
</div>\n\
<!-- Begin Item -->\n\
<div class=\"dropdown_container user_menu_list_div dotmenu\">\n\
<!-- Begin Item Container -->\n\
<ul class=\"arrow_box_menu\">\n\
<li><a href=\"#\"><i class=\"fa fa-pencil\"></i>Edit</a></li>\n\
<li><a href=\"#\"><i class=\"fa fa-trash\"></i>Delete</a></li>\n\
</ul>\n\
</div>\n\
<!-- End Item Container -->\n\
</li>\n\
</ul>\n\
<!-- End Mega Menu -->\n\
</div>\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"comment\">\n\
<div class=\"comment_list_main\">\n\
<div class=\"comment_list\">\n\
<div class=\"comment_list_img\">\n\
<img src=\"images/latest-review-img.png\">\n\
</div>\n\
<div class=\"comment_list_detail\">\n\
<div class=\"latest-review-right-row\">\n\
<div class=\"latest-review-left-name\">\n\ John Smith @johns\n\
</div>\n\
<div class=\"latest-review-time\">2 min ago</div>\n\
</div>\n\
<div class=\"latest-review-right-row\">\n\
<div class=\"latest-review-time\">\n\
<div class=\"mgmenu_fixed mgmenu1\" id=\"mgmenu1\">\n\
<!-- Begin Mega Menu Container -->\n\
<ul class=\"mgmenu\">\n\
<!-- Begin Mega Menu -->\n\
<li class=\"username-menu\">\n\
<div class=\"user_img_div\">\n\
<a style=\"padding-right:0px\" href=\"#\"><img src=\"images/dotimg.png\"></a>\n\
</div>\n\
<!-- Begin Item -->\n\
<div class=\"dropdown_container user_menu_list_div dotmenu\">\n\
<!-- Begin Item Container -->\n\
<ul class=\"arrow_box_menu\">\n\
<li><a href=\"#\"><i class=\"fa fa-pencil\"></i>Edit</a></li>\n\
<li><a href=\"#\"><i class=\"fa fa-trash\"></i>Delete</a></li>\n\
</ul>\n\
</div>\n\
<!-- End Item Container -->\n\
</li>\n\
</ul>\n\
<!-- End Mega Menu -->\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"latest-review-text\"> What a hidden foodie haven! The ambiance is a relaxed with chic decor and healthy atmosphere. <a href=\"#\"> More (+) </a></div>\n\
<div class=\"comment_link\">\n\
<ul>\n\
<li><a href=\"#\"><i class=\"fa fa-heart\"></i>Like</a></li>\n\
<li><a href=\"#\"><i class=\"fa fa-share-alt\"></i>Share</a></li>\n\
</ul>\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"comment_list\">\n\
<div class=\"comment_list_img\">\n\
<img src=\"images/latest-review-img.png\">\n\
</div>\n\
<div class=\"comment_list_detail\">\n\
<div class=\"latest-review-right-row\">\n\
<div class=\"latest-review-left-name\">\n\ John Smith @johns\n\
</div>\n\
<div class=\"latest-review-time\">2 min ago</div>\n\
</div>\n\
<div class=\"latest-review-right-row\">\n\
<div class=\"latest-review-time\">\n\
<div class=\"mgmenu_fixed mgmenu1\" id=\"mgmenu1\">\n\
<!-- Begin Mega Menu Container -->\n\
<ul class=\"mgmenu\">\n\
<!-- Begin Mega Menu -->\n\
<li class=\"username-menu\">\n\
<div class=\"user_img_div\">\n\
<a style=\"padding-right:0px\" href=\"#\"><img src=\"images/dotimg.png\"></a>\n\
</div>\n\
<!-- Begin Item -->\n\
<div class=\"dropdown_container user_menu_list_div dotmenu\">\n\
<!-- Begin Item Container -->\n\
<ul class=\"arrow_box_menu\">\n\
<li><a href=\"#\"><i class=\"fa fa-flag\"></i>Report</a></li>\n\
</ul>\n\
</div>\n\
<!-- End Item Container -->\n\
</li>\n\
</ul>\n\
<!-- End Mega Menu -->\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"latest-review-text\"> What a hidden foodie haven! The ambiance is a relaxed with chic decor and healthy atmosphere. <a href=\"#\"> More (+) </a></div>\n\
<div class=\"comment_link\">\n\
<ul>\n\
<li><a href=\"#\"><i class=\"fa fa-heart\"></i>Like</a></li>\n\
<li><a href=\"#\"><i class=\"fa fa-share-alt\"></i>Share</a></li>\n\
</ul>\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"comment_list\">\n\
<div class=\"comment_list_img\">\n\
<img src=\"images/latest-review-img.png\">\n\
</div>\n\
<div class=\"comment_list_detail\">\n\
<div class=\"latest-review-right-row\">\n\
<div class=\"latest-review-left-name\">\n\ John Smith @johns\n\
</div>\n\
<div class=\"latest-review-time\">2 min ago</div>\n\
</div>\n\
<div class=\"latest-review-right-row\">\n\
<div class=\"latest-review-time\">\n\
<div class=\"mgmenu_fixed mgmenu1\" id=\"mgmenu1\">\n\
<!-- Begin Mega Menu Container -->\n\
<ul class=\"mgmenu\">\n\
<!-- Begin Mega Menu -->\n\
<li class=\"username-menu\">\n\
<div class=\"user_img_div\">\n\
<a style=\"padding-right:0px\" href=\"#\"><img src=\"images/dotimg.png\"></a>\n\
</div>\n\
<!-- Begin Item -->\n\
<div class=\"dropdown_container user_menu_list_div dotmenu\">\n\
<!-- Begin Item Container -->\n\
<ul class=\"arrow_box_menu\">\n\
<li><a href=\"#\"><i class=\"fa fa-flag\"></i>Report</a></li>\n\
</ul>\n\
</div>\n\
<!-- End Item Container -->\n\
</li>\n\
</ul>\n\
<!-- End Mega Menu -->\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"latest-review-text\"> What a hidden foodie haven! The ambiance is a relaxed with chic decor and healthy atmosphere. <a href=\"#\"> More (+) </a></div>\n\
<div class=\"comment_link\">\n\
<ul>\n\
<li><a href=\"#\"><i class=\"fa fa-heart\"></i>Like</a></li>\n\
<li><a href=\"#\"><i class=\"fa fa-share-alt\"></i>Share</a></li>\n\
</ul>\n\
</div>\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"comment_box\">\n\
<div class=\"comment_input\">\n\
<textarea style=\"height: 76px;\" class=\"submitByEnter commentarea\" placeholder=\"Comment\"></textarea>\n\
</div>\n\
<div class=\"comment_att\">\n\
<div class=\"comment_btn\">\n\
<input type=\"button\" value=\"Comment\" class=\"submit-btn button \"> </div>\n\
<div class=\"latest-review-time\">\n\
<div class=\"mgmenu_fixed mgmenu1\" id=\"mgmenu1\">\n\
<!-- Begin Mega Menu Container -->\n\
<ul ng-show=\"isAuth\" class=\"mgmenu\">\n\
<!-- Begin Mega Menu -->\n\
<li class=\"username-menu\">\n\
<div class=\"user_img_div\"><a href=\"#\">Attach</a></div>\n\
<!-- Begin Item -->\n\
<div class=\"dropdown_container user_menu_list_div dotmenu\">\n\
<!-- Begin Item Container -->\n\
<ul class=\"arrow_box_menu\">\n\
<li><a href=\"#\"><i class=\"fa fa-pencil\"></i>Edit</a></li>\n\
<li><a href=\"#\"><i class=\"fa fa-trash\"></i>Delete</a></li>\n\
</ul>\n\
</div>\n\
<!-- End Item Container -->\n\
</li>\n\
</ul>\n\
<!-- End Mega Menu -->\n\
</div>\n\
</div>\n\
</div>\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"popup_right photo_popup_right\">\n\
<div class=\"user_detail_left\">\n\
<div class=\"user_detail_img\">\n\
<a href=\"#\"><img class=\"b4 border_none\" src=\"images/user_photo.jpg\"></a>\n\
</div>\n\
<div class=\"user_detail_name\">\n\
<a href=\"#\">\n\
<span class=\"header-full-name\">John Smith <br></span>\n\
<span class=\"feature_header_username\">@john</span>\n\
</a>\n\
</div>\n\
</div>\n\
<div>\n\
<ul class=\"popup_menu\">\n\
<li><a href=\"\">Share</a></li>\n\
<li>\n\
<div class=\"mgmenu_fixed mgmenu1\" id=\"mgmenu1\">\n\
<!-- Begin Mega Menu Container -->\n\
<ul class=\"mgmenu\">\n\
<!-- Begin Mega Menu -->\n\
<li style=\"border-left:0px\" class=\"username-menu\">\n\
<div class=\"user_img_div\"><a style=\" color:#555555 !important\" href=\"#\">Actions</a></div>\n\
<!-- Begin Item -->\n\
<div class=\"dropdown_container user_menu_list_div dotmenu\">\n\
<!-- Begin Item Container -->\n\
<ul class=\"arrow_box_menu\">\n\
<li><a style=\" padding: 5px 10px;\" href=\"#\"><i class=\"fa fa-pencil\"></i>Edit</a></li>\n\
<li><a style=\" padding: 5px 10px;\" href=\"#\"><i class=\"fa fa-trash\"></i>Delete</a></li>\n\
</ul>\n\
</div>\n\
<!-- End Item Container -->\n\
</li>\n\
</ul>\n\
<!-- End Mega Menu -->\n\
</div>\n\
</li>\n\
<li><a href=\"\">Remove</a></li>\n\
<li><a href=\"\">Open Original</a></li>\n\
</ul>\n\
</div>\n\
</div>\n\
</div>\n\
<div class=\"video_main\">\n\
</div>\n\
<button class=\"mfp-close\" type=\"button\" title=\"Close (Esc)\">×</button>\n\
</form>\n\
"
},
gallery: {
enabled: true
},
callbacks: {
open: function () {
},
change: function () {
},
markupParse: function (template, values, item) {
// optionally apply your own logic - modify "template" element based on data in "values"
// console.log('Parsing:', template, values, item);
},
elementParse: function (item) {
}
}
});
});
}
}
}
}
,
link: function (scope, element, attrs) {
console.log("Shared data in link");
var sharedData = HzPhotoService.getSharedData();
console.log(sharedData);
console.log("=============================");
}
}
}]);
}());
Выше усилий и модификаций кода решают мои проблемы, но я приветствую и ценю оптимизированный ответ.
Dipak chavda
Поделиться
Ещё вопросы
- 0301 Перенаправления после копирования установки Magento
- 0Javascript не работает после загрузки сервера
- 1Adview не отображается в Android
- 1Что за выражение «throws» используется здесь, а что, если не используется?
- 1Angular2 Проверка ввода с помощью регулярных выражений
- 0MYSQL Query - Использование оператора Select в предложении Where
- 0функция вызова при нажатии кнопки
- 1Как вы конвертируете несколько вложенных циклов в лямбду или linq, если у вас сложная структура объекта?
- 1Как добавить один элемент в существующий спиннер?
- 0CSS: позиционирование не работает
- 1Эффективно получить перестановку 3-х рядных массивов разных размеров и типов
- 1Как импортировать библиотеку задач Google в Python
- 0Как обновить графику, чтобы избежать черного экрана?
- 1Как я могу убедиться, что функция запускается ПОСЛЕ функции, которая вызывает ее, завершена?
- 0Как отобразить строку как дату? [Дубликат]
- 1Как запросить «In clause» при сборе коллекции в Linq
- 1вставить новый экземпляр, используя API GCE
- 1NHibernate - наиболее лаконичный способ выбора нескольких столбцов с помощью QueryOver.
- 0Изменить функцию, чтобы использовать класс HTML вместо идентификатора
- 0Кнопка «Нравится» / «Рекомендовать» на Facebook не показывает правильную ссылку на лайк или изображение
- 1Событие GA не запускается для поврежденных изображений, загруженных из файла CSS
- 1Checked list box Проверенные элементы Проверка
- 1Есть ли элегантный способ извлечь отдельные слова из имен переменных в массив?
- 0Как использовать Angular JS для обновления страницы при изменении входного параметра для события
- 1Как составить список строк
- 0Плагин Vegas Background JQuery
- 0Импорт в dockerized mariadb при начальной сборке со скриптом
- 0Настраиваемая ошибка Создание дубликатов
- 0Как настроить абстрактное состояние в качестве фона в AngularJS
- 0Вызов Jquery из сервлета
- 1JAXP - поиск в каталоге отладки XSD
- 1Как сделать так, чтобы текст JLabel изменялся автоматически?
- 0Как использовать ng-repeat, чтобы показать все элементы в одной строке
- 1Самый простой способ добавить политику конфиденциальности с моим приложением для Android
- 0Как использовать функцию std :: transform ()
- 0создание файла для перенаправления вывода оболочки
- 0Различное поведение ng-pattern [duplicate]
- 1Как я могу измерить ширину и высоту повернутого элемента в Javascript?
- 0Соединение AngularJS и CodeIgniter (вызовы GET работают, но POST нет)
- 0определение статической функции в заголовке
- 1Передача значения со страницы в Html.ActionLink
- 0AngularJS - не может изменить значение поля ввода
- 1figsize не влияет на рисунки в ноутбуке Jupyter
- 0ng-repeat с динамическими данными json, полученными в качестве аргумента
- 1Размещение горизонтального рециркулятора в определенной позиции с помощью ConstraintLayout
- 0Получение ожидаемой ошибки неквалифицированного идентификатора с C ++ при попытке выполнить
- 0массивы, removeFirst () не работает?
- 0Передача аргумента для фильтра не в шаблоне HTML
- 1SoftKeyboard накладывается на EditText - ConstraintLayout
- 1Как преобразовать многострочные файлы fasta в однострочные файлы fasta без биопиона
