$scope指令控制器的 modalInstance.result.then() 值没有变化

Question

HTML：

<teacher-modal modal-type="edit" file-name="teacherModal"
button-title="DerecEdit" modal-value="teacher"
button-class="" message="teacherCtrl.message">
</teacher-modal>|
{{teacherCtrl.message}}

命令：

(
function(){
angular.module('MockApp')
.directive('teacherModal',teacherModal);
function teacherModal(){
var directive = {
restrict: 'EA',
scope:{
'type': '@modalType',
'title': '@buttonTitle',
'class': '@buttonClass',
'fileName': '@fileName',
modalValue: '=',
message: '=',
},
template:'<a type="button" class="{{class}}" ng-click="modalDCtrl.open(modalValue,fileName)">{{title}}</a>',
controller:'modalDirectiveController as modalDCtrl'
}
return directive;
}
angular.module('MockApp')
.controller('modalDirectiveController', modalDirectiveController);
modalDirectiveController.$inject = ['$uibModal','TeacherService','$scope', '$rootScope'];
function modalDirectiveController($uibModal , TeacherService , $scope, $rootScope){
var vm = this;
vm.open = function(teacher,fileName){
var msg;
console.log('open function of teacher modal ctrl' + fileName);
var modalInstance = $uibModal.open({
ariaLabelledBy: 'modal-title',
ariaDescribedBy: 'modal-body',
templateUrl: 'components/modalComponent/teacher/'+fileName+'.html',
controller: 'TeacherModalController as teacherModalCtrl',
size: 'md',
resolve:{
newTeacher:function(){
return teacher;
}
}
});
modalInstance.result.then(function (result) {
console.log('result of directive controller');
if(result.actionType == 'Add Teacher')
$scope.message = result.teacherName + " has been added";
else
$scope.message = result.teacherName + " has been edited";
//<!-- The above $scope.message is not being viewed but I want to show this message -->
$rootScope.$broadcast("updateMessage", msg);
}, function () {
console.info('Modal dismissed at: ' + new Date());
});
// <!-- This $scope is being viewed but I dont want to show this message -->
//$scope.message = 'hello from teacher-modalnn.js';
}
}
}
)();

modalInstance.result.then() 函数中的 $scope.message 未预览，而正在查看函数外部的$scope.message。

当我们使用 $rootScope.broadcast() 时，消息正在预览，但我不想使用 $broadcast 服务。

Github网址：https://github.com/coderabin01/ngStudentApp
谁能回答我为什么以及如何？

Answer 1

你在角度上下文之外应用一个值(XHR 调用)，所以你需要使用 $apply()。

$apply() 用于从外部执行 AngularJS 中的表达式 AngularJS框架。(例如，从浏览器 DOM 事件， setTimeout、XHR 或第三方库)。因为我们在呼唤 我们需要执行适当的范围生命周期的 AngularJS 框架

所以试试这个：

...
$scope.$apply(function() {
$scope.message = result.teacherName + " has been added";
});
...