2016-10-20 8 views
0

이전에 만든 응용 프로그램에서 부트 스트랩 대신 각 재료를 사용 하려는데 부트 스트랩 아이콘을 각 재료로 대체하는 방법을 모르겠습니다. 도움을 주셔서 감사합니다.부트 스트랩 아이콘을 각 재료 아이콘으로 바꿉니다.

<md-button class="md-fab md-mini" color="warn" 
    ng-repeat="question in quiz.dataService.quizQuestions" 
    ng-class="{'btn-info': question.selected !== null, 'btn-danger': question.selected === null}" 
    ng-click="quiz.setActiveQuestion($index)"> 
    <span class="glyphicon" 
     ng-class="{'glyphicon-pencil': question.selected !== null, 'glyphicon-question-sign': question.selected === null}"> 
    </span> 
</md-button> 

내가

<i class="material-icons">help</i> 
<i class="material-icons">star_border</i> 

나는이 시도하지만 스팬 아이콘 스타일을 추가하지 못할

<i class="material-icons"> 
    {'help' = : question.selected !== null, 'star_border': question.selected === null} 
</i> 
+0

당신이 시도 했나 : '' help'대신에? –

+0

고맙습니다. 하지만 작동하지 않았습니다. – user6934713

+0

콘솔에 오류가 있습니까? 나는 그것을 문서에서 본다 : https://klarsys.github.io/angular-material-icons/ –

답변

1

작동하지 않았거나 함께 glyphicon의 -pencil 및 glyphicon-질문을 대체하는 것을 시도하고있다 나는 태그를 ... 중첩하여 사용해야합니다.

angular.module('demoapp', ['ngMdIcons']); 

<span> 
    <ng-md-icon icon="help" style="fill: ..." size="..."></ng-md-icon> 
</span> 
(210)

내가 태그가 구글 아이콘입니다 및 BTS

https://klarsys.github.io/angular-material-icons/

업데이트의 예를 참조하십시오 :

<md-toolbar> 
    <div class="md-toolbar-tools"> 
     <div layout="row"> 
      <i class="fa fa-users fa-2x" flex></i> 
      <h1 class="md-title" style="color:white">Org Chart</h1> 
     </div> 
     <span flex></span> 
     <md-fab-speed-dial md-direction="left" ng-class="md-fling"> 
      <md-fab-trigger> 
       <md-button aria-label="menu" class="md-fab md-accent"> 
        <md-tooltip> 
         Actions 
        </md-tooltip> 
        <md-icon md-svg-src="img/icons/ic_view_module_48px.svg"></md-icon> 
       </md-button> 
      </md-fab-trigger> 
      <md-fab-actions> 
       <md-button aria-label="view" class="md-fab md-raised md-mini"> 
        <md-tooltip> 
         View Chart 
        </md-tooltip> 
        <md-icon md-svg-src="" style="color:black" ng-show="cDP.read" ng-click="paneShowFn('read')"></md-icon> 
       </md-button> 
       <md-button aria-label="add" class="md-fab md-raised md-mini"> 
        <md-tooltip> 
         Add Chart 
        </md-tooltip> 
        <md-icon md-svg-src="img/icons/ic_add_48px.svg" style="color:black" ng-show="cDP.insert" ng-click="paneShowFn('insert')"></md-icon> 
       </md-button> 
       <md-button aria-label="Settings" class="md-fab md-raised md-mini"> 
        <md-tooltip> 
         Security Access 
        </md-tooltip> 
        <md-icon md-svg-src="img/icons/ic_add_48px.svg" style="color:black" ng-show="cDP.permission" ng-click="paneShowFn('permission')"></md-icon> 
       </md-button> 
       <md-button aria-label="edit" class="md-fab md-raised md-mini" style="color:black" ng-show="cDP.update" ng-click="paneShowFn('update')"> 
        <md-tooltip> 
         Edit Chart 
        </md-tooltip> 
        <md-icon md-svg-src="img/icons/ic_edit_48px.svg" style="color:black"></md-icon> 
       </md-button> 
      </md-fab-actions> 
     </md-fab-speed-dial> 
    </div> 
</md-toolbar> 
+0

감사합니다. 조건으로 내 스팬을 수정하는 방법을 보여 주시겠습니까? – user6934713

+0

시도했지만 작동하지 않았습니다. user6934713

+0

업데이트 : 코드 예제 –

관련 문제