AngularJS Шаблон директивы не обновляется

Question

Несмотря на часы, директива шаблона не обновляется ... чего здесь не хватает? Журналы внутри часов действительно работают, так почему же 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>

Answer 1

ERRONEOUS

template: '<div> {{ scope.teacher | json }} </div>',

BETTER

template: '<div> {{ teacher | json }} </div>',

AngularJS выражения оцениваются в контексте области действия. Нет необходимости добавлять его в HTML.