Angular: 向指令发送参数的正确方法

Question

我对 Angular 有点陌生，我正在尝试掌握如何以 "correct" 方式利用 Angular 指令。

我的用例是我正在使用 Angular 和 ThreeJS 开发一个 3D 项目查看器。用户可以有不同的 "projects" 可供他查看。

我们想利用项目标识的方式是通过url参数，这样一个人就可以link一个特定的项目给其他人查看。

将Viewer/Renderer定义为一个指令，这样我们就可以定义如下的查看器

...
    <viewer></viewer>
...

据我了解，有一些不同的方法可以将 url 参数传递给查看器指令，我正在尝试利用 $stateParams 从 url.但是当我继续工作时，没有 "clear" 访问 $stateParams 的方法，但你必须将控制器连接到指令，然后从那里访问它。

这是执行此操作的预期方式吗？或者我应该将它定义为查看器指令的属性吗？如果是这样，我如何访问 html 代码中的 url 参数？还是有第三种更好的选择？

正如您可能了解的那样，我对 angular 有点陌生，我主要想了解 Angular 的预期用途，这样我就不会搞砸太多现在开始。

此致，大卫。

Answer 1

您可以访问您的 url parameters via scope，因为您将传递一个字符串，因此 @ 在这里更有意义：

scope: {
    datasource: '@'
}

在您的指令中，您可以像这样传递值：

<viewer datasource={{urlParamValue}}></viewer>

并且在您的 controller 中，您可以像这样收集 url 参数：

function Controller($scope, $location){
    var urlParamValue = $location.search().urlParamValue;    
}

Answer 2

您可以使用如下方式进行双向绑定。

scope: {
    datasource: '=datasource'
}