Question

最近我开始在我的角度应用中使用指令时就好了。

我正在构建一个文本搜索，所以我要做的是创建一个文本字段，并在用户键入文本字段时观察它调用搜索服务器。

以下是我为此制定的指令：

angular.module('myApp.directives')
    .directive('autoComplete', function($resource, API_URL) {
        var url = API_URL + 'api/search';

        function link(scope, element, attrs) {
            scope.$watch(attrs.autoComplete, function(value) {
            if(value === null || value === "" ){
                return;
            }
            $resource(url)
            .get(function(products) {
                // $scope.items = products;
                console.log(products);
            }, function(response) {
                console.log(response);
            });
        });
    } // Function link
    return {
        link: link
    };
});

这是用于编写搜索文本的文本字段：

<input type="text" placeholder="Search" ng-model="keyword" auto-complete>

问题是搜索endPoint只在我浏览到视图时被调用一次，即使在搜索字段中没有输入任何内容，当我键入时，观察者也没有对搜索服务器进行工作调用在搜索栏中。

我厌倦了另一种方式，因为我还不熟悉指令，但我也有同样的行为：

$scope.keyword = null;

        $scope.$watch(function() { return $scope.keyword; }, function (newVal, oldVal) {
            if (newVal !== "" || newVal !== null) {
                    $resource(url)
            .get(function(products) {
                console.log(products);
            }, function(response) {
                console.log(response);
            });
            } else  {

            return;

            }//else
        });

Answer 1

您需要观看＆＃39; ngModel＆＃39;属性改为属性＆＃39; autoComplete＆＃39;

Angular：如何构建一个指令来观察文本字段

1 个答案: