如果容器为空,如何放置输出消息?这是小胡子模板的代码:
<script id="matches" type="text/template">
<div class="matchmain">
<div class="infor">
<div class="time">
@{{#ongoing}}
<span style="color: #72A326; text-shadow: 1px 1px 0px #4A7010; font-weight: bold; font-size: 16px"> LIVE</span>
@{{/ongoing}}
@{{#open}}
<strong class="match_countdown" data-schedule="@{{formatted_schedule}}">
@{{formatted_schedule}}</strong>
@{{/open}}
</div>
<div class="series">@{{league.name}}</div>
</div>
@{{#is_current}}
<div class="match " style="background-image: url({{url('/public_image')}}/@{{league.image}})">
@{{/is_current}}
@{{^is_current}}
<div class="match " style="background-image: url({{url('/public_image')}}/@{{league.image}})">
@{{/is_current}}
@{{#label}}
<div class="col-sm-10" style="text-align: center; font-weight: bold;"><span class="matchLabel">@{{label}}</span></div>
@{{/label}}
<div class="col-sm-10 matchleft">
<a href="{{url('/')}}/match/@{{id}}">
<div style="width: 45%; float: left; text-align: right">
<img class="team2_img" src="{{url('/')}}/@{{team_a.image}}" style="float: right;border-radius: 2px;" />
@{{#team_a_winner}}
<img src="{{asset('images/won.png')}}" style="position: absolute; margin: -10px 0 0 -15px;">
@{{/team_a_winner}}
<div class="teamtext">
<b style="font-size: 0.9vw">@{{team_a.name}}</b><br>
<i class="percent-coins">@{{teama_percentage}}%</i>
</div>
</div>
<div class="vs_div" style="float: left; text-align: center; margin-top: 0.6em">
<span class="format" style="background: #fff;">@{{best_of}}</span><br><span style="background: #fff;">vs</span>
</div>
<div style="width: 45%; float: left; text-align: left">
<img class="team2_img" src="{{url('/')}}/@{{team_b.image}}" style="float: left;border-radius: 2px;" />
@{{#team_b_winner}}
<img src="{{asset('images/won.png')}}" style="position: absolute; margin: -10px 0 0 -15px;">
@{{/team_b_winner}}
<div class="teamtext">
<b style="font-size: 0.8vw">@{{team_b.name}}</b><br>
<i class="percent-coins">@{{teamb_percentage}}%</i>
</div>
</div>
</a>
</div>
</div>
</div>
这是jquery的代码:
$('.categorybtn').click(function(){
var $btn = $(this);
$btn.button('loading');
var categ = $(this).attr('id');
var currIndex = $('#matchesHolder .matchmain:last').index();
var container = $("#matches").html();
var url = "";
console.log(categ);
switch(categ){
case 'loadAll':
$("#loadAllMore").data('pointer',0);
url = "{{url('/match/loadAll')}}/" + $btn.data('pointer')
break;
case 'loadDota':
$("#loadDotaMore").data('pointer',0);
url = "{{url('/match/dota2')}}/" + $btn.data('pointer')
break;
case 'loadCsgo':
$("#loadCsgoMore").data('pointer',0);
url = "{{url('/match/csgo')}}/" + $btn.data('pointer')
break;
case 'loadSports':
$("#loadSportsMore").data('pointer',0);
url = "{{url('/match/sports')}}/" + $btn.data('pointer')
break;
}
$.get(url)
.done(function(data) {
$btn.button('reset');
$new_contents = '';
$.each(data.matches, function() {
var match = this;
switch(this.status){
case 'open':
match.open = true;
break;
case 'ongoing':
match.ongoing = true;
break;
}
match.formatted_schedule = moment().format(this.schedule);
$new_contents += Mustache.render(container, this);
});
if($btn.data('pointer') == 0){
$('#matchesHolder').html($new_contents);
}
else{
$('#matchesHolder').append($new_contents);
}
$btn.data('pointer', data.pointer);
$.each($('.match_countdown'), function(key, index) {
countdown(this, $(this).data('schedule'));
});
});
});
这是dota 2的索引控制器的代码。
public function dota2index($ptr)
{
$leagues = \App\League::active()->orderby('leagues.status','desc')->orderBy('created_at','desc')->get()->load('teams.bets');
$_matches = \App\Match::mainMatches()->where('leagues.type','=','dota2')->get()->load('league','teamA', 'teamB')->sortByDesc('schedule')->slice($ptr, 100);
$dotaresult = \App\Match::mainMatches()->where('leagues.type','=','dota2')->whereIn('matches.status',['open','ongoing'])->first();
$liveList = collect();
$openList = collect();
$oldList = collect();
foreach ($_matches as $_m) {
$_m->teama_percentage = number_format($_m->teamA->matchWinPercentage($_m->id), 2);
$_m->teamb_percentage = number_format($_m->teamB->matchWinPercentage($_m->id), 2);
if ($_m->schedule->isFuture()) {
if($_m->status == 'ongoing')
$liveList->push($_m);
else if($_m->status == 'open')
$openList->push($_m);
else
$oldList->push($_m);
} else {
if ($_m->status == 'ongoing')
$liveList->push($_m);
else if($_m->status == 'open')
$openList->push($_m);
else
$oldList->push($_m);
}
}
$_liveList = $liveList->sortBy('schedule');
$dotamatches = $_liveList->merge($openList->sortBy('schedule'));
if($dotaresult == null){
return [
'status' => ['No Matches available']
];
}
else
return [
'matches' => $dotamatches,
'pointer' => $ptr
];//view('dota2', compact('teams', 'dotamatches', 'leagues'));
}
我添加了一个“ $ dota2result” if语句,它在console.log中是成功的,但是我在如何在模板上显示它上遇到了麻烦。
因此,基本上一切正常,唯一缺少的是,如果每个选项卡都没有匹配项,它将显示“没有匹配项”。既然只有1个容器,该如何实现?谢谢!