Question

我正在angularjs中写一个指令并得到上面提到的错误。我正在使用书中的代码。

.directive('myFacebook', [function(){
return {
    link: function(scope,element,attributes) {
        (function(d) {
                var js, id = 'facebook-jssdk',
                    ref = d.getElementsByTagName('script')[0];
                if (d.getElementById(id)) {
                    return;

                }
                js = d.createElement('script');
                js.id = id;
                js.async = true;
                js.src = "//connect.facebook.net/en_US/all.js";
                ref.parentNode.insertBefore(js, ref);
            }(document));
            // Initialize FB
            window.fbAsyncInit = function() {
                FB.init({

                    appId: 'xxxx', //birthday reminder
                    status: true, // check login status
                    cookie: true, // enable cookies to access the session
                    xfbml: false // parse XFBML
                });
                //Check FB Status
                FB.getLoginStatus(function(response) {
                     xxxx
                });
            };
        scope.username='';
    },
    scope: {
            permissions: '@',
            myFriends: '=friends'
        },
    controller: function($scope) {
        $scope.loadFriends = function() {
            FB.api('/me/friends?fields=birthday,name,picture', function(response) {
                    $scope.$apply(function() {
                        $scope.myFriends = response.data;
                    });
                });
        }
    },

    template:'Welcome {{username}}'
   }}])

我在

收到错误

 $scope.$apply(function() {
            $scope.myFriends = response.data;
 });

HTML代码

<div my-facebook></div>
<h1> My Friend's Birthday Reminder</h1>
<div ng-repeat="friend in myFriends">
     {{friend.name}}
</div>

Answer 1

我的解决方案在这里很难找到，但更容易实现。我不得不将其更改为相当于（请注意，问号使该属性成为可选项。在1.5之前，这显然不是必需的。）

scope: {
    permissions: '@',
    myFriends: '=?friends'
}

Answer 2

问题是您没有在指令元素friends中定义属性<div my-facebook></div>。

定义指令的范围时，如下所示：

scope: {
    permissions: '@',
    myFriends: '=friends'
}

你基本上是在说：

将具有相同名称的DOM属性的值绑定到本地作用域的permissions属性
在本地范围的myFriends属性与父范围的friends属性

由于您没有在DOM中定义属性friends，因此Angular无法创建双向绑定并抛出错误。更多信息here。

在DOM上定义friends属性，它应该解决问题：

<div my-facebook friends="friendList"></div>

例如，在控制器上：

app.controller('Ctrl', function($scope) {
  $scope.friendList = [];
});

Answer 3

不是OP问题的直接答案，但这恰好发生在我身上，对于其他可能将来谷歌此错误的人。这与JohnP的答案类似。

如果指令中有camelCase属性，也会出现此错误。

所以如果你有：

<asp:Button ID="Button1" runat="server" Text="Button" /> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <Triggers> <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click"> </asp:AsyncPostBackTrigger> </Triggers> </asp:UpdatePanel>

它会抛出错误。

这是因为（取自角度documentation）：

Angular规范化元素的标记和属性名称，以确定哪些元素与哪些指令匹配。我们通常通过其区分大小写的camelCase规范化名称（例如ngModel）来引用指令。但是，由于HTML不区分大小写，我们通过小写形式引用DOM中的指令，通常使用DOM元素上的划线分隔属性（例如ng-model）。

规范化过程如下：

从元素/属性的前面剥离<div my-facebook myFriends></div>和x-。

将data-，:或- - 分隔名称转换为camelCase。

所以_

需要成为<div my-facebook myFriends></div>

Answer 4

我遇到了同样的问题，对我来说问题是DOM名称中的大写字符。

TAG POS=1 TYPE=(Not sure what to put here) ATTR=TXT:Banana
TAG POS=R-1 TYPE=A ATTR=TXT:*

没有用，但是

<div my-facebook FRIENDS="friendList"></div>

的工作。我花了一天时间研究这个并偶然找到了解决方案。

Answer 5

之所以这样，是因为我试图更新指令范围内的另一个变量，但是即使它是经过计算的，也不应该在html中传递它，

这是指令范围的示例

scope: {
  var1: '=',
  var2: '='
}

在该指令中，我可以将其传递给var1或var2，但不能同时传递给它，指令逻辑将找到另一个var的值

当我使用var1调用指令并在代码中更新var2时，该错误发生在我身上

<pb-my-directive  var1="something"></my-directive>

要解决此问题，请在您的示例中使用您要更新的所有作用域变量调用指令，甚至使用非含义值

<pb-my-directive  var1="something" var2="false"></my-directive>

希望这对您有帮助

Answer 6

如果将其用作单向绑定，则只需适当地定义范围即可：

scope: {
   example: '<'
}

在我的情况下，我将双向绑定用作单向绑定，并传递了以下内联对象：

<directive bindings="{key: value}"></directive>

我的情况很特殊，因为我（故意）破坏了对象，从而破坏了它们的绑定，但是如果您只需要单向绑定，就可以这样定义。

错误：[$ compile：nonassign] Expression＆＃39; undefined＆＃39;用于指令＆＃39; myFacebook＆＃39;是不可转让的

6 个答案: