Ich arbeite an einer App, die in AngularJS geschrieben wurde. Auf einer der Seiten werden eine Reihe von Widgets angezeigt, die Informationen über die Zustände verschiedener Aspekte der App anzeigen. Ich habe kürzlich daran gearbeitet, den Überschriften eines jeden Widgets einen "Home" -Button hinzuzufügen, der den Benutzer auf die "Root" -Seite des Widgets führt, wenn er angeklickt wird.AngularJS Panel Überschrift zeigt nur ein Element, wenn innerhalb eines Abschnitts definiert
Ich habe dies bekam arbeiten erfolgreich auf den meisten der Widgets, jedoch auf einer von ihnen, wenn ich die ‚Home‘ -Taste in der Überschrift anzuzeigen, wird das Widget Name nicht mehr in der Überschrift angezeigt ...
die template im directive für dieses Widget verwendet wird, wie folgt definiert:
.directive('table', function(tag, $location){
return{
restrict: 'E',
scope: {
...
},
template: '<section class="panel-frame" ' +
'data-ng-class="{\'panel-brand\': !inverse(), ' +
'\'panel-inverse panel-inverse-borderless\': inverse()}">' +
'div class="panel-heading" ' +
'<span data="{{heading}}"></span>' +
'<i class="pull-right ti-home" data-ng-click="browserPage()" /> ' +
'<data-ng-show="heading">' +
'</div><ul-grid config="config" rows="tableRows || rows">' +
'</ul-grid></section>',
wenn ich die Seite mit der Vorlage sehen, wie es oben ist, wird das ti-home Symbol auf der Widget Überschrift angezeigt, und wenn ich es klicken Ich werde auf die "Home" -Seite für dieses spezielle Widget geleitet. Jedoch wird das Widget (textuelle Namen Widget) Überschrift derzeit nicht auf dem Widget angezeigt, wie es ist:
Wenn ich das ti-home Bild aus der Widget Überschrift entfernen (so es ändern zurück, wie es war ursprünglich), dh
template: '<section class="panel panel-frame" ' +
'data-ng-class="{\'panel-brand\': !inverse(), ' +
'\'panel-inverse panel-inverse-borderless\': inverse()}">' +
'<div class"panel-heading" ' +
'<span data-i18n="{{heading}}"></span>' +
'<data-ng-show="heading">' +
'<div><ul-grid config="config" rows="tableRows || rows">' +
'</ul-grid></section>',
Dann wird der Titel (Textname) korrekt im Widget angezeigt werden, obwohl natürlich die Taste ‚Home‘, die ich aufgenommen hatte nicht mehr da ist:
Der Grund, warum ich die -18n aus dem <span data-i18n ... ></span> Tag entfernt, wenn die ‚Home‘ -Taste, um die Widget Hinzufügen Überschrift war, weil es mein Verständnis ist, dass -i18n mit bedeutet, dass Sie nur in der Lage sein werden, eine Sache, in diesem Tag angezeigt werden soll.
Ich habe auch versuchen, die Linie für das Bild im Widget Hinzufügen Überschrift in während i18n war noch im Einsatz:
'<i class="pull-right ti-home" data-ng-click="browserPage()" /> ' +
aber wenn die Seite angezeigt wird, wird nur der Textteil der Überschrift ist displayed- nicht das Bild.
Wie kann ich beide den Text & die Home-Schaltfläche in der Überschrift des Widgets zur gleichen Zeit anzeigen?
auf andere Widgets auf der gleichen Seite verwendet, ich habe es gelungen, die ‚Home‘ Taste ohne die Textbeschreibung aus dem Widget Überschrift entfernt wird hinzuzufügen:
Dieses Widget hat die folgenden template in seinem directive:
template: '<section class="panel panel-frame" data-ng-class="{\'panel-brand\': !inverse(), \'panel-inverse\': inverse()}">' +
'<div class="panel-heading">' +
'<span data-i18n="{{title}}"></span>' +
'<i data-ng-hide="hideChartPageBtn" class="pull-right glyphicon-clickable ti-bar-chart" data-ng-click="chartPage()"></i>' +
'<i class="pull-right ti-home" data-ng-click="chartPage()" />' +
'<div class="umw-chart-cfg-btn-group" data-ng-if="chartCfgs.length">' +
'<a href="" data-ng-click="btnQty = minBtns" data-ng-show="btnQty > minBtns && chartCfgs.length > minBtns" ' +
'class="btn btn-sm"><span class="ti-angle-double-right"></span></a>' +
'<button type="button" class="btn btn-{{conf.state}} btn-sm" data-ng-show="chartCfgs.length > 1"' +
'data-ng-click="redrawChart(conf)" data-ng-repeat="conf in chartCfgs | limitTo: btnQty">{{$index + 1}}</button>' +
'<a href="" data-ng-click="btnQty = chartCfgs.length" data-ng-show="chartCfgs.length > btnQty" ' +
'class="btn btn-sm"><span class="ti-angle-double-left"></span></a>' +
'</div></div>' +
'<um-chart control="control"></um-chart>' +
'</section>',
ich kann nicht sehen, warum dies funktioniert, aber was ich versuche, mit dem ‚Tisch‘ Widget zu tun nicht ... jemand irgendwelche Vorschläge, wie ich bekommen kann bo Würden das Widget "Titel" und der "Home" -Button gleichzeitig in der Widget-Überschrift angezeigt?