2017-08-03 4 views
0

AngularJSで書かれたアプリケーションで作業しています。いずれかのページには、アプリのさまざまな側面の状態に関する情報を表示するウィジェットが数多く表示されています。私は最近、各ウィジェットの見出しに「ホーム」ボタンを追加しています。クリックすると、そのウィジェットに属する「ルート」ページに移動します。AngularJSのパネル見出しは、セクション内で定義されたときに1つの要素のみを表示します。

私が持っているこの私は見出しに「ホーム」ボタンを表示する場合は、ウィジェット名はもはや...

見出しに表示され、そのうちの一つに、しかし、成功したウィジェットの最も上の作業していません

このウィジェットのためにdirectiveで使用templateは次のように定義されています。それは上記のように、私はテンプレートでページを表示すると、ti-homeアイコンがウィジェットの見出しに表示され

.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>', 

、と私はそれをクリックしてください、私はその特定のウィジェットの「ホーム」ページに移動します。しかし、(ウィジェットのテキスト名)を見出しウィジェットは、現在のウィジェットに表示されていないことがあるよう:私は、ウィジェットの見出しからti-home画像を削除した場合

widget with Home icon

は(それがあったかに戻ってそれを変更します

:明らかに、私は追加した「ホーム」ボタンがもはやありませんが、もともと)、すなわち

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>', 

次に見出し(テキスト名)は、ウィジェットに正しく表示されていますそれは-i18nを使用してあなただけのそのタグの中に一つのことを表示することができますことを意味することに私の理解だから

見出しウィジェットに「ホーム」ボタンを追加するとき、私は<span data-i18n ... ></span>タグから-18nを削除した理由でした。

私はまた、i18nがまだ使用中であった間にある見出しウィジェット内の画像のための行を追加してみました:

'<i class="pull-right ti-home" data-ng-click="browserPage()" /> ' + 

が、ページを表示するとき、見出しのテキストのみの部分はdisplayed-ではありません画像。

ウィジェットの見出しに「&」というテキストと「ホーム」ボタンの両方を同時に表示するにはどうすればよいですか?

同じページ上で使用される他のウィジェットでは、私はウィジェットの見出しから削除されたテキスト記述せずに「ホーム」ボタンを追加することができました:

chart widget

このウィジェットは、以下のtemplateを持っていますその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>', 

私は、この作品理由を知ることはできませんが、私は...誰もが私を得ることができる方法についてどのような提案を持っていない「テーブル」ウィジェットに何をしようとしていますボーウィジェット 'title'とウィジェットの見出し内に同時に表示される 'Home'ボタンは同時に表示されますか?

答えて

0

AH-は、問題が何であったか発見:私はpanelクラスの>がありませんでした:

'<div class="panel-heading" >' + 
関連する問題