將$ resource查詢參數傳遞給angular-material md-chips自動完成

Question

我試圖使用角度材質的md-autocomplete傳遞帶有$ resource的可搜索數據庫查詢。

這是我的控制器

var pendingSearch, cancelSearch = angular.noop; 
    var cachedQuery, lastSearch; 
    $scope.allContacts = loadContacts(); 
$scope.contacts = [$scope.allContacts[0]]; 
$scope.asyncContacts = []; 
$scope.filterSelected = true; 
$scope.querySearch = querySearch; 
$scope.delayedQuerySearch = delayedQuerySearch; 
var contacts=[]; 
    /** 
    * Search for contacts; use a random delay to simulate a remote call 
    */ 

    function querySearch (criteria) { 
    cachedQuery = cachedQuery || criteria; 

    User.Item.search({key: cachedQuery}).$promise.then(function (data) { 

     for (var i = 0; i < data.lists.length; i++) 
     { 
     var contacts.push(data.lists[i].last_name) 
     } 
    return cachedQuery ? $scope.allContacts.filter(createFilterFor(cachedQuery)):[] 

    }) 

    } 
    /** 
    * Async search for contacts 
    * Also debounce the queries; since the md-contact-chips does not support this 
    */ 
    function delayedQuerySearch(criteria) { 
    cachedQuery = criteria; 
    if (!pendingSearch || !debounceSearch()) { 
     cancelSearch(); 
     return pendingSearch = $q(function(resolve, reject) { 
     // Simulate async search... (after debouncing) 
     cancelSearch = reject; 
     $timeout(function(criteria) { 
      resolve($scope.querySearch(criteria)); 
       refreshDebounce() ; 
     }, Math.random() * 900, true) 
     }); 
    } 
    return pendingSearch; 
    } 
    function refreshDebounce() { 
    lastSearch = 0; 
    pendingSearch = null; 
    cancelSearch = angular.noop; 
    } 
    /** 
    * Debounce if querying faster than 300ms 
    */ 
    function debounceSearch() { 
    var now = new Date().getMilliseconds(); 
    lastSearch = lastSearch || now; 
    return ((now - lastSearch) < 500); 
    } 
    /** 
    * Create filter function for a query string 
    */ 
    function createFilterFor(query) { 
    var lowercaseQuery = angular.lowercase(query); 
    return function filterFn(contact) { 
     return (contact._lowername.indexOf(lowercaseQuery) != -1);; 
    }; 
    } 

    function loadContacts() { 


    return contacts.map(function (c, index) { 
     var cParts = c.split(' '); 
     var contact = { 
     name: c, 
     email: cParts[0][0].toLowerCase() + '.' + cParts[1].toLowerCase() + '@example.com', 
     image: 'http://lorempixel.com/50/50/people?' + index 
     }; 
     contact._lowername = contact.name.toLowerCase(); 
     return contact; 
    }); 
    } 

這是我的HTML

<md-list class="fixedRows"> 
       <md-subheader class="md-no-sticky">Contacts</md-subheader> 
       <md-list-item class="md-2-line contact-item" ng-repeat="(index, contact) in allContacts" 
           ng-if="contacts.indexOf(contact) < 0"> 
        <img ng-src="{{contact.image}}" class="md-avatar" alt="{{contact.name}}" /> 
        <div class="md-list-item-text compact"> 
        <h3>{{contact.name}}</h3> 
        <p>{{contact.email}}</p> 
        </div> 
       </md-list-item> 
       <md-list-item class="md-2-line contact-item selected" ng-repeat="(index, contact) in contacts"> 
        <img ng-src="{{contact.image}}" class="md-avatar" alt="{{contact.name}}" /> 
        <div class="md-list-item-text compact"> 
        <h3>{{contact.name}}</h3> 
        <p>{{contact.email}}</p> 
        </div> 
       </md-list-item><h2 class="md-title">Searching asynchronously.</h2> 
       <md-contact-chips 
       ng-model="asyncContacts" 
       md-contacts="delayedQuerySearch($query)" 
       md-contact-name="name" 
       md-contact-image="image" 
       md-contact-email="email" 
       md-require-match="true" 
       md-highlight-flags="i" 
       filter-selected="filterSelected" 
       placeholder="To"> 
       </md-contact-chips> 

但是我一直得到

angular.js:12722 TypeError: Cannot read property 'map' of undefined 

或未定義長度的角材料錯誤。

Answer 1

可變聯繫人是'未定義的'。在所調用的方法上移動「contacts」變量的聲明。它應該像 -

var contacts =[]; 
$scope.allContacts = loadContacts(); 
function loadContacts(){ 
    // your logic comes here 
    alert(JSON.stringyfy(contacts); 
}