2017-04-19 76 views
1

即时通讯设法从InterviewRecorderController onStart()调用但它没有调用回调。当我改变在onStart: '& '在onStart:'='回调是工作,但背景是InterviewRecorderController,而不是InterviewController父指令中的角度指令上下文变化

感谢你的帮助

Interview 
 

 
<div class="text-center"> 
 
    <div class="h3 font-thin text-info m-b">In order to prepare your custom plan, we need to hear how you currently speak{{interview.description}}</div> 
 
    <div class="h3 font-thin text-info m-b">When you are ready press on the microphone to start recording (dont have)</div> 
 
    <interview-recorder on-start="interview.onStart"></interview-recorder> 
 
    <div ng-if="interview.isRecording"> 
 
    <div class="m-t" ng-if="$index == interview.t_index" ng-repeat="t in interview.topics"> 
 
     <div class="animated font-thin h3" ng-class="{'fadeInLeft':$index == interview.t_index,'fadeOutRight':$index != interview.t_index}">{{t.pbData.cleanInput}}</div> 
 
    </div> 
 
    <div class="btn btn-default btn-addon m-t" ng-click="interview.t_index = interview.t_index + 1">Next topic<i class=" icon-control-forward"></i></div> 
 
    </div> 
 
</div>

interviewRecorder 
 

 
<div class="text-center"> 
 
    <div class="m-b"><timer on-finish="interviewRecorder.onFinish" state="interviewRecorder.timerState" class="h3" total-seconds="interviewRecorder.seconds" mode="stopWatch"></timer><div> 
 
    <div ng-class="{'animated':interviewRecorder.timerState}" class="infinite pulse" tooltip-trigger="mouseenter" tooltip="{{interviewRecorder.tr('MEDIA_SETTINGS.READY')}}" tooltip-placement="top"> 
 
     <span ng-class="{'btn-primary':interviewRecorder.timerState}" class="btn btn-default btn-icon btn-rounded btn-lg" ng-click="interviewRecorder.onStartRec()"> 
 
      <i class="icon-microphone"></i> 
 
     </span> 
 
    </div> 
 
</div>

class InterviewController{ 
 

 
    constructor($scope,$translate,PhrasesBankService,presetService,languageService){ 
 
    //this.questions = $scope.data.questions; 
 
    this.t_index = 0; 
 
    this.tr = $translate.instant 
 
    //this.seconds = 10; 
 
    this.isRecording = false; 
 
    this.topics = PhrasesBankService.getTopics(presetService.topicTypes.basicTopic.type,'en_usa'); 
 
    } 
 
    onStart(){ 
 
    this.isRecording = true; 
 
    } 
 
    onfinish(){ 
 
    var bla = 123213; 
 
    } 
 

 
} 
 

 
angular.module('novotalkWebApp').controller('InterviewController',InterviewController); 
 
angular.module('novotalkWebApp').directive('interview', function() { 
 
    return { 
 
     restrict: 'E', 
 
     templateUrl: 'app/web/components/poll/interview.html', 
 
     controller: 'InterviewController', 
 
     controllerAs:'interview', 
 
     bindToController:true, 
 
     scope:{ 
 
      data : '=' 
 
     } 
 
    }; 
 
});

class InterviewRecorderController{ 
 
    constructor($translate,$scope){ 
 
    this.timerState = false; 
 
    this.seconds = 10; 
 
    this.tr = $translate.instant; 
 
    this.$scope = $scope;; 
 
    } 
 
    onFinish(){ 
 

 
    } 
 
    onStartRec(){ 
 
    this.timerState = true; 
 
    this.onStart(); 
 
    } 
 
} 
 
angular.module('novotalkWebApp').controller('InterviewRecorderController',InterviewRecorderController); 
 
angular.module('novotalkWebApp').directive('interviewRecorder',() => { 
 
    return { 
 
     restrict: 'E', 
 
     templateUrl: 'app/web/components/interviewRecorder/interviewRecorder.html', 
 
     controller: 'InterviewRecorderController', 
 
     controllerAs:'interviewRecorder', 
 
     bindToController: { 
 
     onStart:'&' 
 
     } 
 

 
    }; 
 
});

+0

你能认罪你也分享你的模板代码吗? –

+0

我已更新帖子,ty为快速回复^^ – SalvationCode

回答

0

这会为你工作,

<interview-recorder on-start="interview.onStart()"></interview-recorder> 
+1

完成了工作!谢谢。我也发现this.onStart = this.onStart.bind(this);与onStart:'='也适用。你的方式更好^^ – SalvationCode