尽管有监视,但模板指令未更新。.这里缺少什么?手表内的日志确实可以正常使用,为什么HTML也不更改?
college.directive('showTeacherInfo', function ($http) {
return {
restrict: 'E',
transclude: true,
scope: {
'subject': '@subjectId'
},
template: '<div> {{ scope.teacher | json }} </div>',
link: function (scope, element, attrs) {
console.log('Retrieving teacher information ...');
scope.teacher = {};
var getTeacherInfo = function () {
if (!isNaN(scope.subject)) {
$http(
{
method: 'GET',
url: '/Subject/GetTeacherOfSubject',
params: { id: scope.subject }
}).then(function successCallback(response) {
if (response.data) {
scope.teacher = response.data;
}
}, function errorCallback(response) {
console.log(response);
});
}
};
attrs.$observe('subjectId', function () {
getTeacherInfo();
});
scope.$watch('teacher', function () {
console.log(scope.teacher);
});
}
}
});
并且在html中
<show-teacher-info subject-id="{{currentSubjectID}}"></show-teacher-info>
ERRONEOUS
template: '<div> {{ scope.teacher | json }} </div>',
更好
template: '<div> {{ teacher | json }} </div>',
AngularJS表达式是在范围的上下文中求值的。无需将其添加到HTML。