使用$ templateRequest时，双向绑定很多

Question

我有一个模板，使用$ templateRequest加载。我在模板中有一个textarea。 textarea填充控制器中设置的值。但是当我尝试在控制器方法中访问textarea时，它不会更新值。

模板

<div class="panel add-notes">
    <div class="panel-body">
        <textarea ng-model="quickNote" rows="5"/>
        <button ng-click="saveNotes()">Add Note</button>
        </div>
    </div>
</div>

加载模板的方法

$scope.displayPanel = function(templateName){
    var templateURL = resourceURL+templateName+".html";

    $templateRequest(templateURL).then(function(template) {
        $compile($("#modalContent").html(template).contents())($scope);
    },function() {
       //ERROR HANDLER
    });
};

控制器方法

$scope.saveNotes = function(){
    console.log($scope.quickNote);
}

在控制台日志中，quickNote的值显示为undefined。任何决议？