接下来点击图像库设置

Next on click image gallery setup

本文关键字：设置 图像 接下来      更新时间：2023-09-26

我有一个三个选择菜单，根据来自我的控制器的JSON数据相互绑定。

<select class="browser-default" ng-model="selManga" ng-options="manga.seri for manga in mangas">
    <option value="" disabled selected>Select a Manga</option>
    <option></option>
</select>
<select class="browser-default" ng-model="selChapter" ng-options="chapter.klasor for chapter in selManga.randomword">
    <option value="" disabled selected>Chapter</option>
    <option></option>
</select>
<select class="browser-default" ng-model="selPage">
    <option value="" disabled selected>Page</option>
    <option ng-repeat="page in selChapter.yol" value="{{page}}">{{$index+1}}</option>
</select>
<a><img ng-src="/{{selPage}}"></a>
Javascript: 

.factory('MMG', function($http){
 var fveg= {};
 var url = 'http://api.mangayurdu.com/manga?callback=JSON_CALLBACK';
 fveg.adlar = $http.jsonp(url);
 return fveg;
 })
.controller('nbgCtrl',function  ($scope, MMG, $stateParams) {
    MMG.adlar.success(function(loHemen) {
    $scope.mangas = loHemen;
});

现在我想要的是，当你点击打开图像，它必须加载下一个图像，等等。如果可能的话，当你点击第788章的最后一张图片时它会加载第789章。我怎样才能做到这一点?

这是我的jsfiddle:https://jsfiddle.net/Nasuh/zn85oonk/5/

参见提琴

<select class="browser-default" ng-model="selManga" ng-options="manga.title for manga in mangas">
    <option value="">Select a Manga</option>
</select>
<select ng-show="selManga" class="browser-default" ng-model="selChapter" ng-options="+idx as chapter.title for (idx, chapter) in selManga.chapters">
    <option value="">Chapter</option>
</select>
<select ng-show="selManga.chapters[selChapter].pages" class="browser-default" ng-model="selPage" ng-options="+idx as (+idx + 1) for (idx, page) in selManga.chapters[selChapter].pages">
    <option value="">Page</option>
</select>
<img ng-src="{{selManga.chapters[selChapter].pages[selPage]}}" ng-click="next(selManga, selChapter, selPage)">

修改:

  • 删除空<option></option>
  • 移除disabled selected。如果需要选择，请设置与ng-model
    • 绑定的变量。
  • 将绑定到selPage的图像元素移动到控制器
    • 下
  • 选择章节和页面索引而不是url
  • 添加ng-click和next(manga, chapter, page) function
  • 移除两个监视器
相关文章：