将对象传递给自定义指令而不创建观察者？

Question

我创建了一个自定义指令 ("reusable component")，它通过绑定到通过 HTML 参数传递给它的两个对象来创建一个独立的范围。问题很快就出现了，因为我的文档中有多达 600 个这样的组件，这导致 1200 个观察者和糟糕的性能。我不需要这些观察者，只需要某种形式的 "bind once"-传递对象时的功能。有没有办法完成这个（或解决方法），或者我需要重新设计我的代码？

（将数据作为一个或多个字符串而不是对象传递是一种非常不受欢迎的选择。）

Answer 1

您可以手动评估对象，而无需使用 Angular 指令范围绑定。假设你有一个指令 some-component 并且你想在其中传递一个 config 对象以保留独立的指令范围。你可以这样做：

<some-component config="controller.config"></some-component>

那么指令可能如下所示：

.directive('someComponent', function() {
  return {
    scope: {
      // some bindings, but not config
    },
    link: function(scope, element, attrs) {
      var config = scope.$parent.$eval(attrs.config)
      console.log(config)
    }
  }
})

$parent 在这里是必需的，因为指令作用域是隔离的，并且您想获得在外部（父）作用域中定义的对象。

尝试一下，看看它是否对您的设置有所帮助。

Answer 2

您应该使用单向绑定：

scope : {
    myField: '&'
    ....
}

并在指令中使用：

<my-directive my-field="::myDataObjectFromScope"></my-directive>

也许this会有所帮助

但如果值始终不变，您应该使用服务将数据与业务逻辑分开

将对象传递给自定义指令而不创建观察者？

Pass object to custom directive without creating watchers?

watch

angularjs

angularjs-directive

bindonce