Question

在我的html文件中，我使用的是一个指向searchBox的指令：

<ng-lms-search-box searchType="Author" maxResult=5 data-ng-model="searchText"> </ng-lms-search-box>

这是我在app.js中定义指令的函数：

lmsModule.directive('ngLmsSearchBox', [ '$http', function($http) {
    return {
        restrict : 'E',
        replace : 'true',
        $scope : {
            searchType : '@searchType',
            searchText : '@ngModel',
        },
        templateUrl : '../templates/searchBox.html',
        bindToController : true,
        link : function($scope, element, attrs) {
            console.log($scope.searchType);
            if ($scope.searchType == "Author") {
                element.bind('keyup', function() {
                    $http.post("listAuthor/" + $scope.searchText + "/1", {
                        'Content-Type' : 'application/json'
                    }).success(function(data) {
                        $scope.$emit("passData", data);
                    });
                });
            } else if ($scope.searchtype == "Publishers") {
            } else {
            }
        },
    };
} ]);

$scope.searchType应该是＆＃34;作者＆＃34;然而，＆＃34;未定义＆＃34;。

任何人都知道为什么？提前谢谢！

Answer 1

HTML应该是蛇形的：

  search-type="Author"

在你的指令定义中使用camelCase。

 $scope.searchType

Answer 2

它是scope而不是$scope：

JSFiddle

scope : {
    searchtype : '@searchtype',
    searchtext : '@ngModel',
},

您应该使用全部小写或searchType成为serch-type

Answer 3

在模板中声明变量应该使用破折号分隔符，如下所示，因为您使用了范围变量作为searchType，这是驼峰式的。在DDO（指令定义方向）中它应该是scope而不是$scope

search-type

参考：https://docs.angularjs.org/guide/directive

<ng-lms-search-box search-type="Author" maxResult=5 data-ng-model="searchText"> </ng-lms-search-box>

AngularJs，$ scope.variable在指令中未定义

3 个答案: