unserver-unify/src/app/course/chapter/poetry.html

<div class="poetry">
  <div class="btn-group pull-right">
    <label class="btn btn-info" ng-click="wctrl.playAll()">
      读全篇
    </label>
    <label class="btn btn-info" ng-model="wctrl.mode" uib-btn-radio="'brief'">
      简介
    </label>
    <label class="btn btn-info" ng-model="wctrl.mode" uib-btn-radio="'explain'">
      解释
    </label>
    <label class="btn btn-info" ng-model="wctrl.mode" uib-btn-radio="'comments'">
      注释
    </label>
    <label class="btn btn-info" ng-model="wctrl.mode" uib-btn-radio="'backgroud'">
      背景
    </label>
    <label class="btn btn-info" ng-model="wctrl.mode" uib-btn-radio="'authorintro'">
      作者简介
    </label>
  </div>
  <div class="headline text-center">
    <h3>
      <strong>
        {{ wctrl.chapter.options.name.text }}
      </strong>
    </h3>
    <h5>
      <span class="color-blue">
        {{ wctrl.chapter.options.date.text }} 
        <span>
          - {{ wctrl.chapter.options.author.text }}
        </span>
      </span>
    </h5>
  </div>
  <div class="clearfix"></div>
  <div class="row height_poetry">
    <div class="col-md-12 poetry_para">
      <div class="poetry_line" ng-repeat="ppt in wctrl.chapter.ppts">
        <div class="poetry_word" ng-repeat="char in ppt.chars track by $index">
          <span class="poetry_phonetic">{{ppt.prons[$index]}}</span>
          <span class="poetry_character">{{char}}</span>
        </div>
        <a class="btn btn-info btn-xs" ng-click="wctrl.togglePPTAudio(ppt)">
          <i class="fa" ng-class="{'fa-volume-off':!ppt.playFlag,'fa-stop':ppt.playFlag}"></i>
        </a>

      </div>
    </div>
    <div class="col-md-12 poetry_explanation">
      <div>
        {{ctrl.chapter.options[wctrl.mode].text}}
      </div>
      <a class="btn btn-info btn-xs" ng-click="wctrl.playAudioFile(ctrl.chapter.options[wctrl.mode].audio)" ng-if="ctrl.chapter.options[wctrl.mode].audio">
        <i class="fa fa-volume-off">
        </i>
      </a>
    </div>
  </div>
</div>