當用戶點擊角度中的事件時返回模板

Question

我正在嘗試討論angular（剛剛從昨天開始）的語法以及實現以下操作的最佳方式。我想要做的是加載一些編譯的html並將其注入到DOM中。這是這個問題的後續行動：first time writing an Angular directives and returning a compiled template。而不是致電

<div my-customer></div> 

我想基於用戶交互動態加載模板。這樣說：

<div ng-click="loadMyCustomer()">load customer</div><!-- should load here --> 
.... 

arcModule.controller('MainCtrl', function($scope, $http){ 
    $scope.sayHello(){ 
    alert("hello here"); 
    } 

    $scope.loadMyCustomer=function(){ 
    //alert("hello"); 
    // return the template in the mycustomer directive and place it after the current DOM element from which it is called 
    } 
    $scope.customer = { 
    name: 'Naomi', 
    address: '1600 Amphitheatre' 
    }; 
}); 

arcModule.directive('myCustomer', function() { 
    return { 
    template: 'Name: {{customer.name}}<button ng-click="sayHello()">Click to say hello.</button> Address: {{customer.address}}' 
    }; 
}); 

很抱歉，如果這聽起來很簡單，但我覺得角文檔有點不透明的，如果我能想出如何回報這一點，我會很高興。那麼，我將如何通過loadMyCustomer方法返回指令中的模板？

Answer 1

對於您突出顯示的內容，可以在不創建新指令並使用當前的ng-include指令的情況下完成。

即使你有做這樣

<div ng-click="showCustomer=true">... 
<div my-customer ng-if="showCustomer"></div> 

的ngif的優點是，模板不會被加載，直到showCustomer是真實的。