具有两个数据绑定的角指令中访问范围



早上好,我有一个小问题,我有指令:

return {
        restrict:'E',
        scope: {
            user: "="
        },
        template: '<b>{{userLogin}}</b>',
        link:function(scope,elem,attrs){
        },
        controller: function ($scope) {
           console.log($scope.user)//always undefindet
            $scope.userLogin = $scope.user;
        },
    };

我想在模板中使用范围显示我的参数"用户",因为我需要从服务器下载一些数据我认为问题在这里(指令):

scope: {
                user: "=" //when i have this response "undefined"
                user: "@" //when i have this response not show id only text
            },

我的html

<get-user-login user="{{post.user_id}}"></get-user-login>

我总是得到:空间中的空值或未定义。如何修复。

使用@时,您必须使用插值为:

<get-user-login user="{{post.user_id}}"></get-user-login>

注意 @仅适用于文本值

使用=时,您不需要插值

<get-user-login user="post.user_id"></get-user-login>

注意 =仅用于传递对象(二线曲线)

我为您构建了此演示,它可以正常工作:

<!DOCTYPE html>
    <html lang="en" ng-app="app">
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.min.js"></script>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body ng-controller="ctrl">
        <get-user-login  user="post.user_id"></get-user-login >
        <script> 
        angular.module("app",[])
             angular.module("app").
             controller("ctrl",function($scope){
                $scope.post = {user_id:565};
             }).
             directive('getUserLogin', function() {
                 return {
                    restrict:'E',
                    scope: {
                        user: "="
                    },
                    template: '<b>{{userLogin}}</b>',
                    link:function(scope,elem,attrs){
                    },
                    controller: function ($scope) {
                    console.log($scope.user)//always undefindet
                        $scope.userLogin = $scope.user;
                    },
                };
             });
        </script>
    </body>
    </html>

您确定要为指令提供正确的价值吗?因为在GetPost中,您将其绑定到$ scope.onepost,所以也许正确的方法是:

<get-user-login user="{{onePost.user_id}}"></get-user-login>

最新更新