typeaheadドロップダウンからコントローラを呼び出す

Question

私は、ブートストラップ先読みによって生成されたドロップダウンからオプションを選択する際に、コントローラ機能を呼び出す方法を知りました。ドロップダウンの各項目には固有のIDがあります。オプションを選択するときに他の関数に渡す必要があります。

HTML：

<div class="container-fluid" ng-app="stock" ng-controller="mainCtrl as main"> 
    <h2>Stock Search</h2> 
     <input type="text" ng-model="val" placeholder="Search for a stock" uib-typeahead="obj as obj.name for obj in result | filter:$viewValue | limitTo:10" ng-keydown="main.getStock(val)" typeahead-no-results="noResults" class="form-control" my-enter="main.getDetails(result)"> 
    <div ng-show="noResults"> 
     <i class="glyphicon glyphicon-remove"></i> No Results Found 
    </div> 
</div> 

はJavaScript：

angular.module('stock', ['ui.bootstrap']) 

.config(['$qProvider', function ($qProvider) { 
    $qProvider.errorOnUnhandledRejections(false); 
}]) 

.directive('myEnter', function() { 
    return function (scope, element, attrs) { 
     element.bind("keydown keypress", function (event) { 
      if(event.which === 13) { 
       scope.$apply(function(){ 
        scope.$eval(attrs.myEnter); 
       }); 

       event.preventDefault(); 
      } 
     }); 
    }; 
}) 

.controller('mainCtrl', function($scope, $http){ 

    var app = this; 
    app.config = { 
     headers: { 
     'User-ID': 379, 
     'Access-Token':'eWEyOS5HbHNwQkRCVUJPX2d0UUNGUVR4Z1NKRTgzUkdCWHB2V1NCbWwtckNHWW5iS05NSjJLY0J5YU5CeU5QWFhTU3R5N1phdTctd250aW15dk5ZUFcySEt3ckpxNUdCNFhwQzYyNGVQcnlKSWlYa21Fa0xvQ0hIZ1kxZVRjaU0wJVVTRVIlMzc5', 
     'User-IP':'0.0.0.0', 
     'Agent':'agent' 
     } 
     }; 

    $scope.result = []; 
    this.getStock = function(val){ 
    $http.get("https://staging.investo2o.com/assetmanager-ws/api/v1/assets/getassets?query="+val+"&assetType=STK", app.config) 
       .then(function(response){ 
        $scope.result = response.data; 
        return $scope.result; 
      }); 
     } 

    this.getDetails = function(id){ 
     console.log(id); 
    }    

})//end of ctrl 

私はこれをどのように行うのですか？

Answer 1

あなたがattrs.myEnterを求めるとき、それはあなたの式を含む単なる文字列です。 $ evalはその文字列をスコープに対して評価します。しかし、私は、$ evalは関数を含み実際にその関数を実行する文字列をとることを意図していないと思います。より短い構文でスコープ上に存在する値について報告することができます。そのルートに行きたい場合は、$ parseサービスを見てください。

しかし、おそらくそれを行うと思われる方法は、ディレクティブ定義オブジェクトにスコーププロパティを追加することです。myEnterを "&"に設定すると、scope.myEnterに関数が与えられます。この関数を実行すると、my-enter属性でコードを実行するようになります。