0
角度材料のmd-autocompleteを使用して、$ resourceで検索可能なデータベースクエリを渡そうとしていました。ここで
私は未定義の長さの
angular.js:12722 TypeError: Cannot read property 'map' of undefined
または角度-材料エラーを取得しておくが、私のコントローラここ
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>
です。