AngularJS - $ biên dịch Chỉ thị với một đối tượng làm tham số thuộc tính

Question

Khi tôi sử dụng $compile để tạo và ràng buộc chỉ thị, làm cách nào để thêm biến làm thuộc tính? Biến là một đối tượng.

var data = { 
    name: 'Fred' 
}; 

var dirCode = '<my-directive data-record="data"></my-directive>'; 

var el = $compile(dirCode)($scope); 

$element.append(el); 

Và myDirective sẽ được mong đợi:

... 
scope: { 
    record: '=' 
}, 
... 

Tôi đã cố gắng làm

`var dirCode = '<my-directive data-record="' + data + '"></my-directive>';` 

thay vì quá.

Answer 1

Nó khá dễ dàng, chỉ cần tạo phạm vi mới và đặt thuộc tính dữ liệu trên đó.

angular.module('app', []); 
 

 
angular 
 
    .module('app') 
 
    .directive('myDirective', function() { 
 
    return { 
 
     restrict: 'E', 
 
     template: 'record = {{record}}', 
 
     scope: { 
 
     record: '=' 
 
     }, 
 
     link: function (scope) { 
 
     console.log(scope.record); 
 
     } 
 
    }; 
 
    }); 
 

 
angular 
 
    .module('app') 
 
    .directive('example', function ($compile) { 
 
    return { 
 
     restrict: 'E', 
 
     link: function (scope, element) { 
 
     var data = { 
 
      name: 'Fred' 
 
     }; 
 
     
 
     var newScope = scope.$new(true); 
 
     newScope.data = data; 
 

 
     var dirCode = '<my-directive data-record="data"></my-directive>'; 
 

 
     var el = $compile(dirCode)(newScope); 
 
    
 
     element.append(el); 
 
     } 
 
    }; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script> 
 

 
<div ng-app="app"> 
 
    <example></example> 
 
</div>