将Angular typeahead对象结果传递给控制器​​中的另一个函数

时间:2015-08-15 22:32:57

标签: javascript angularjs angular-ui-typeahead

在这种情况下,我使用ui-bootstrap typeahead从外部api捕获对象。使用select回调我获取该对象并将结果设置在我的控制器中的单独函数中。

问题是我希望将这些结果发送到一个单独的api,并使用我已经设置的点击功能。我的问题是如何将提前输入的结果导入点击功能发布?用户流程如下。

<div>
    <input type="text" placeholder="Find A Game" 
           typeahead-on-select="setGames($item)" 
           ng-model="asyncSelected" 
           typeahead="test.name for test in getGames($viewValue)" 
           typeahead-loading="loadingLocations" typeahead-min-length="3" 
           typeahead-wait-ms="500" typeahead-select-on-blur="true" 
           typeahead-no-results="noResults">
</div>


<div ng-show="noResults">
  No Results Found
</div>
<button ng-disabled="!asyncSelected.length" 
        ng-click="addtodb(asyncSelected)">Add To Database</button>

如您所见,标签设置为项目名称,这可以正常工作。当用户选择名称时,然后使用 typeahead-on-select =&#34; setGames($ item)&#34; 将整个对象发送给自己的功能。从那里我想要获取对象并将其传递给另一个函数,您可以在按钮标签中看到ng-click。我目前已经通过了模型,但我真正想要的是从select事件中传递$ item中的整个对象。到目前为止,我的控制器看起来像这样:

angular.module('2o2pNgApp')
  .controller('GiantCtrl', function ($scope, $http, TermFactory, $window, SaveFactory) {

      $scope.getGames = function(val) {
        return $http.jsonp('http://www.example.com/api/search/?resources=game&api_key=s&format=jsonp&limit=5&json_callback=JSON_CALLBACK', {
          params: {
            query:  val
          }
        }).then(function(response){
          return response.data.results.map(function(item){
            return item;
          });
        });
      };

      $scope.setGames = function (site) {
        var newsite = site;
      };


      $scope.addtodb = function (asyncSelected, newsite) {
            TermFactory.get({name: asyncSelected}, function(data){
              var results = data.list;
              if (results === undefined || results.length === 0) {
          SaveFactory.save({vocabulary:'5', name:newsite.name, field_game_id:newsite.id}, function(data) {
              $window.alert('All Set, we saved '+asyncSelected+' into our database for you!')
          });
              } else {
                // do stuff
            });
      }

  });

无论我做什么,我似乎无法将整个$ item对象传递给此click函数以发布我需要的所有信息。

1 个答案:

答案 0 :(得分:0)

通过评论中的新发展:

  

$ item仅在本地可用于typeahead-on-select ...你可以   要么将其分配给控制器中的某个模型,要么实际上,   使typeahead模型成为项目:typeahead =“test as   test.name for getGames($ viewValue)“ - New Dev