组合多列结果UI.Bootstrap Typeahead Angularjs

时间:2016-05-19 16:59:04

标签: php angularjs angular-ui-typeahead

我有一个使用ui.bootstrap typeahead的搜索栏。我在用户表中搜索email,first_name和last_name。

我已将所有内容都连接起来,但它只适用于输入字段中输入的第一个OR姓氏名称,而不是两者一起输入。 名字和姓氏没有连接在一起。 输入电子邮件,只会显示与其相关的名称的结果,而不会显示电子邮件的完成情况。

我希望最后一部分有意义。

我认为我需要以不同的方式处理数据,然后再将其传递回HTML。但我不确定该怎么做。

这是我到目前为止所拥有的:

navbar.HTML

<input placeholder="Search..."
       ng-model="navbar.selected"
       uib-typeahead="results as results.first_name + ' ' + results.last_name for results in navbar.getSearchResults($viewValue)"
       type="text"
       typeahead-loading="loadingSearch"
       typeahead-min-length="3"
       typeahead-no-results="noResults"
       class="form-control" />

search.Controller

var vm = this;

vm.getSearchResults = getSearchResults;

function getSearchResults(search) {
  return searchService.getSearchResults(search);
}}

search.Service

function getSearchResults(search) {
  return $http.get(API_URL + '/search/' + search)
    .then(handleSuccess)
    .catch(handleError);
}

// private functions
function handleSuccess(response) {
  return response.data[0];
}

function handleError(error) {
  $log.error('XHR error: ');
  $log.error(error);
  return $q.reject(error);
}}

PHP

    public function searchUsers($search)
    {   
        $this->db->where('email', "$search%", 'like', 'or')->
                   where('first_name', "$search%", 'like', 'or')->
                   where('last_name', "$search%", 'like', 'or'); 
        return $this->db->get('users');


    }
    public function getSearch($search)
    {
        $results = array();
        $search = $this->repository->searchUsers($search);
        foreach ($search as $value) {
            $newResult = array();
            $newResult['email'] = $value['email'];
            $newResult['first_name'] = $value['first_name'];
            $newResult['last_name'] = $value['last_name'];
            $results[] = $newResult;
        }
        return $results;
    }

如果我遗漏了任何内容,请告诉我。 任何帮助将不胜感激。

编辑: 回顾一下预先输入文档时我发现的一件事是使用自定义模板。

通过使用自定义模板,我可以在显示结果列表中添加电子邮件。

    <script type="text/ng-template" id="customTemplate.html">
      <a>
          <span ng-bind-html="match.label | uibTypeaheadHighlight:query"></span><br/>
          <span ng-bind-html="match.model.email | uibTypeaheadHighlight:query"></span><br/>
          <br/>
      </a>
    </script>

&#34; uibTypeaheadHighlight:query&#34;可能是多余的,但这就是我如何让它为我工作。

我仍然无法正确连接名字和姓氏。

0 个答案:

没有答案