Question

我有一个指令需要与使用隔离范围的指令一起工作。当然，这会引发这个错误：

Multiple directives asking for new/isolated scope

我的代码大致如下：

HTML：

<p custom_directive='variable' vendor_directive>Test</p>

JS：

app.directive('ExampleDirective',function() {
    return {
        restrict: 'A',
        scope: {
            exampleDirective: '='
        },
        link: function(scope,element,attributes){
            // manipulate scope.exampleDirective
        }
    }

    });

我已经尝试从我的指令中完全删除范围并使用以下内容：

scope.exampleDirective = scope.$eval(attributes.exampleDirective)

然而，这似乎只适用于对象，而我的目标是其他类型的变量。

如何实现这一目标？

Answer 1

请尝试以下代码：

＆＃13;

<?php while($row = $result->fetch(PDO::FETCH_ASSOC)){ ?>
    <option><?= $row["team_name"]; ?></option>
<?php } ?>

＆＃13;

var myApp = angular.module('myApp', []);
myApp.controller('myController', ['$scope', function($scope){
  
}]);

myApp.directive('exampleDirective',function() {
    return {
        restrict: 'A',
        scope: {
            data:"="
        },
        template: 'In Directive :<div> <input type="text" ng-model="data"></div>',
        link: function(scope,element,attributes){
            // manipulate scope.exampleDirective
        }
    }
});

＆＃13;

Answer 2

我在这里可以看到的问题是vendor_directive已经创建了一个隔离的范围，因此angular不允许您在相同的摘要周期中定义另一个隔离的范围。有两种方法可以解决这个问题 -

首先，更复杂的是您装饰供应商指令以包含自定义指令的功能。这是更稳定和可信赖的方式。在此处查看装饰器的文档decorator
第二种简单的方法是在attributes.exampleDirective变量上使用$ watcher并在每次更改时执行一个函数，这样它就会模仿你想要的双向绑定

希望这有帮助

Answer 3

试试这个：

app.directive('ExampleDirective',function() {
  return {
    restrict: 'A',
    bindToController: {
        exampleDirective: '='
    },
    scope: true,
    link: function(scope,element,attributes) {
        // manipulate scope.exampleDirective
    }
  }
});

没有隔离范围的指令中的双向数据绑定

3 个答案: