This is a migrated thread and some comments may be shown as answers.

AngularJS {{message}} not shown inside tabestrip

2 Answers 97 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Bertha
Top achievements
Rank 1
Bertha asked on 13 Nov 2015, 09:59 PM

Inside ContentURL of the tab i.e. "occupancy.html", it did not show {{message}} of controller.

<div id="fundingTab" data-ng-controller="fundingController">

{{message}}  <== show in here, but not inside occupancy.html (i.e. inside tab)
        <ul>
   <li class="k-state-active">Occupancy</li> <== click & travel to occupany.html but not show {{message}}
    <li>Revenue</li>
</ul>
</div>

 

$(document).ready(function () {
var ts = $("#fundingTab").kendoTabStrip({
animation: { open: { effects: "fadeIn" } },
contentUrls: [
  'clientApp/views/funding/occupancy.html',
  'clientApp/views/funding/revenue.html'
]
}).data('kendoTabStrip');
ts.tabGroup.on('click', 'li', function (e) {
ts.reload($(this));
});
});

2 Answers, 1 is accepted

Sort by
0
Bertha
Top achievements
Rank 1
answered on 16 Nov 2015, 08:33 PM

Instead of using javascript for url.  I put the partial page to html and I can get {{message}} inside tapstrip.

 <ul>
<li class="k-state-active">Occupancy</li>
<li>Revenue</li>
<li>Ancillary Revenue</li>
</ul>
<div>
<div data-ng-include="'/clientApp/views/funding/occupancy.html'"></div>
</div>
<div>
<div data-ng-include="'/clientApp/views/funding/revenue.html'"></div>
</div>
<div>
<div data-ng-include="'/clientApp/views/funding/ancillary.html'"></div>
</div>

0
Petyo
Telerik team
answered on 18 Nov 2015, 08:09 AM

Hello Bertha,

 

the jQuery widget initialization syntax you use does not make the tabstrip aware of the angularjs context - so the expressions in the remote view won't be parsed. If you use the tabstrip directive, that approach should work as expected. 

 

Regards,
Petyo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
TabStrip
Asked by
Bertha
Top achievements
Rank 1
Answers by
Bertha
Top achievements
Rank 1
Petyo
Telerik team
Share this question
or