2

我在 tab1 中有 3 个按钮,在 tab2 中有 3 个 codemirror 文本区域。现在,我真正想要的是在每次单击按钮时更新 codemirror。它也在更新,但是在我进入第二个选项卡并单击 codemirror 区域之后。我希望它仅在按钮单击时更新。

这是我的代码镜像代码。html代码

           <div id="aCDialog" class="col-lg-12">
           <div class="comment-tabs">
            <ul>
            <li class="active" id=""><a role="tab" data-toggle="tab" data-target="#aButton">Buttons</a></li>
            <li class="" id=""><a role="tab" data-toggle="tab" data-target="#aData">Data</a></li>

            </ul>
            <div class="tab-content">
            <div class="tab-pane active" id="aButton">
                    <button id="b1" ng-click="selectButton('f1')"></button>
                     <button id="b2" ng-click="selectButton('f2')"></button>
                     <button id="b3" ng-click="selectButton('f3')"></button>   
             </div>    
                <div class="tab-pane active" id="aData">
    <ui-codemirror ui-codemirror="editorOptions" id="htmlRefresh" ui-refesh="true" ng-model="uiCode.htmlcodeModel"></ui-codemirror>
    <ui-codemirror ui-codemirror-opts="jsEditorOptions" ui-refesh="true"  ng-model="uiCode.jsACCodeModel"></ui-codemirror>
    <ui-codemirror ui-codemirror-opts="cssEditorOptions" ui-refesh="true"  ng-model="uiCode.cssCode"></ui-codemirror>
     </div>
     </div>
     </div>
      </div>

js代码

    $scope.editorOptions = { 
            mode: mixedMode,
              lineNumbers: true,
              lineWrapping : true,
              autoRefresh:true,
              gutters: ["CodeMirror-lint-markers"],
              lint: true, 
    };
    $scope.jsEditorOptions = { 
            mode: 'text/javascript',
            lineNumbers: true,
              lineWrapping : true,
              autoRefresh:true,
              gutters: ["CodeMirror-lint-markers"],
              lint: true,
    };
    $scope.cssEditorOptions= { 
            mode: 'text/css',
            lineNumbers: true,
              lineWrapping : true,
              autoRefresh:true,
              gutters: ["CodeMirror-lint-markers"],
              lint: true,
    };
    $scope.selectButton = function(filename){


          commonCall.getSelectedData(filename).success(function(data) {  
              $scope.uiCode.htmlcodeModel=data.html;
              $scope.uiCode.jsACCodeModel=data.js;
              $scope.uiCode.cssCode=data.css;
          });
      };
4

0 回答 0