Angular.js如何使用具有隔离作用域的指令构建动态模板部件

Question

我有一个指令。。。像这样：

.directive('formMenuBuilderMenu', function (formMenuService) {
    return {
        templateUrl: '../../views/templates/formmenubuilder-menu-template.html',
        restrict: 'A',
        scope:{
            menu:'='
        },
        link: function postLink(scope, element, attrs) {
           // does stuff 
         } ...

每当创建新的菜单节点时，都会使用$compile动态构建它。

        scope.menu = {//new data for menu view directive part}
        var $nodeTemplate = '<div form-menu-builder-menu menu="menu"></div>';
        var html = $compile($nodeTemplate)(scope);
        $content.append(html);

我的印象是，因为我在formMenuBuilderMenu指令中定义了scope部分，所以该指令将具有隔离范围，并且不受新实例创建的的影响

但这根本不起作用！

发生的情况是，每次使用$compile创建新指令时，scope.menu都会使用以前创建的所有指令的新值进行更新，而不会保留其独立范围。实际上，在创建的每个指令中注销scope表明它每次都是同一个作用域实例。

如何做到这一点，使指令范围保持独立，并且每个实例都有自己的scope？这可能吗？如果需要进一步解释，请告诉我。我确信我做这件事的方式不对，所以如果能给我一个正确的方向，我将不胜感激。

需要明确的是，我的主要目标基本上是使用指令创建动态模板部件，每个指令都有自己的数据子集。

Answer 1

代替：

var html = $compile($nodeTemplate)(scope);

试试这个：

var html = $compile($nodeTemplate)(scope.$new());