angular.js - 動態修改 directive 的templateUrl 只有在controller中生效,在directive中操作不生效

Question

//在controller中呼叫changeContentUrl 頁面範本可以更換. 但在下方homeAction點擊事件中操作url 不生效
var home = angular.module("home", [ "common" ]);

    home.controller("homeCtrl", function($scope, commonFactory) {
    
        $scope.contentUrl = "template/userInfo";
        $scope.changeContentUrl = function(contentUrl) {
             console.log(contentUrl);
            $scope.contentUrl = "adada"; 
        };
    });
    home.directive("content", function() {
        return {
            restrict : "E",
            template : "<p ng-include='getContentUrl()'></p>",
            link : function($scope, $element, $attr) {
                $scope.getContentUrl = function() {
                    return $attr.url;
                };
            }
        };
    });
home.directive("homeAction",function(commonFactory){
        return function($scope,element,attrs){
                var node =  element.find("li");
                node.on("click",function(event){
                    var url = $(event.target).attr("url");
                    $scope.contentUrl=url;
                    console.log($scope.contentUrl);
                });
            
        };
    });

Answer 1

homeAction 有問題：

home.directive("homeAction",function(commonFactory){
    return function($scope,element,attrs){
        var node =  element.find("li");
        node.on("click",function(event){
            var url = $(event.target).attr("url");
            $scope.contentUrl=url;
            console.log($scope.contentUrl);
        });
    };
});

function(commonFactory){ 沒有傳回 directive 的設定訊息，需要傳回 JSON。