a4DEVP
a4DEVP

Reputation: 351

Call $http.get from directive link

I need to call $http.get function from directive link in AngularJS, here is my code...this is an autocomplete function.

or is there any way to call a controller from the directive link function?

Here is the code

.directive('ionSelect',function(){

'use strict';
return{
    restrict: 'EAC',
    scope: {
       label:'@',
        labelField:'@',
        provider:'=',
        ngModel: '=?',
        ngValue: '=?',
        myFunctionToCall : '='

    },
     require: '?ngModel',
     transclude : false,
     replace: false,
    template:
                '<div class="selectContainer">'
                 //   +'<label class="item item-input item-stacked-label">' 
                      //  +'<span class="input-label">{{label}}</span>'
                     //   +'<div class="item item-input-inset">'
                            +'<label class="item item-input" >'
                                +'<i class="icon ion-ios-search-strong"></i>'
                                +'<input id="filtro" type="search"  ng-model="ngModel" style="padding: 5px;" ng-value="ngValue" ng-keydown="onKeyDown()"/>'
                  //          +'</label>'
                       //     +'<button class="button button-small button-clear" ng-click="open()">'
                      //          +'<i class="icon ion-chevron-down"></i>'
                      //      +'</button>'
                    //    +'</div>' 
                    +'</label>'
                    +'<div class="optionList padding-left padding-right" ng-show="showHide">'
    +'<ion-scroll>'
                        +'<ul class="list">'
    +'<li class="item" ng-click="selecionar(item)" ng-repeat="item in provider | filter:ngModel" >{{item[labelField]}}</li>'                    
                        +'</ul>'
    +'</ion-scroll>'
                    +'</div>'    
                +'</div>'
         ,


    link: function (scope, element, attrs,ngModel) {
        scope.ngValue = scope.ngValue !== undefined ? scope.ngValue :'item';

        scope.ontouch1 = function(item){
            console.log(item[labelField]);alert(1);
        };

        scope.selecionar = function(item){
            ngModel.$setViewValue(item);
            scope.showHide = false;
        };

        element.bind('click',function(){
            element.find('input').focus();
        });

        scope.open = function(){

              scope.ngModel = "";  
            return scope.showHide=!scope.showHide;
        };

        scope.onKeyDown = function(){
            scope.showHide = true;
            if(!scope.ngModel){
                 scope.showHide = false;
            }
        }

        scope.$watch('ngModel',function(newValue){
            if(newValue)

        element.find('input').val(newValue[scope.labelField]);

        if(newValue[scope.labelField]!== undefined){

          alert(newValue[scope.labelField]);

At this point I need to call $http.get request function to database

continuation of the code:

                }
            });
        },
    };  
})

I am new to this coding please help...

Upvotes: 2

Views: 7005

Answers (1)

aorfevre
aorfevre

Reputation: 5064

just include $http into your directive declaration to call it later

.directive('ionSelect',function($http){

Upvotes: 5

Related Questions