Fehler bei der Verwendung von eckigen Material md-Autocomplete

Question

Ich benutze eckigen Material Autocomplete.I bekomme Fehler, wenn Sie auf die AutoVervollständigen Textfeld klicken.

TypeError: Cannot read property 'then' of undefined 
at me (angular-material.min.js:13) 
at ve (angular-material.min.js:13) 
at e.q [as focus] (angular-material.min.js:13) 
at fn (eval at compile (angular.js:15152), <anonymous>:4:295) 
at e (angular.js:26673) 
at b.$eval (angular.js:17958) 
at b.$apply (angular.js:18058) 
at HTMLInputElement.<anonymous> (angular.js:26678) 
at HTMLInputElement.dispatch (jquery.min.js:3) 
at HTMLInputElement.r.handle (jquery.min.js:3) 

hier ist mein Controller. (function() { 'use strict';

angular 
    .module('app') 
    .controller('MenuController', MenuController); 

MenuController.$inject = ['$location', '$rootScope', '$scope', '$mdMedia', '$mdDialog']; 
function MenuController($location, $rootScope, $scope, $mdMedia, $mdDialog) { 

    $scope.headtext = "This is header"; 


    function initController() { 

    } 


    var self = this; 
    self.simulateQuery = false; 
    self.isDisabled = false; 
    self.repos   = loadAll(); 
    self.querySearch = querySearch; 
    self.selectedItemChange = selectedItemChange; 
    self.searchTextChange = searchTextChange; 
    // ****************************** 
    // Internal methods 
    // ****************************** 
    /** 
    * Search for repos... use $timeout to simulate 
    * remote dataservice call. 
    */ 
    function querySearch (query) { 
     var results = query ? self.repos.filter(createFilterFor(query)) : self.repos, 
      deferred; 
     if (self.simulateQuery) { 
      deferred = $q.defer(); 
      $timeout(function() { deferred.resolve(results); }, Math.random() * 1000, false); 
      return deferred.promise; 
     } else { 
      return results; 
     } 
    } 
    function searchTextChange(text) { 
     $log.info('Text changed to ' + text); 
    } 
    function selectedItemChange(item) { 
     $log.info('Item changed to ' + JSON.stringify(item)); 
    } 
    /** 
    * Build `components` list of key/value pairs 
    */ 
    function loadAll() { 
     var repos = [ 
      { 
       'name'  : 'Angular 1', 
       'url'  : 'https://github.com/angular/angular.js', 
       'watchers' : '3,623', 
       'forks'  : '16,175', 
      }, 
      { 
       'name'  : 'Angular 2', 
       'url'  : 'https://github.com/angular/angular', 
       'watchers' : '469', 
       'forks'  : '760', 
      }, 
      { 
       'name'  : 'Angular Material', 
       'url'  : 'https://github.com/angular/material', 
       'watchers' : '727', 
       'forks'  : '1,241', 
      }, 
      { 
       'name'  : 'Bower Material', 
       'url'  : 'https://github.com/angular/bower-material', 
       'watchers' : '42', 
       'forks'  : '84', 
      }, 
      { 
       'name'  : 'Material Start', 
       'url'  : 'https://github.com/angular/material-start', 
       'watchers' : '81', 
       'forks'  : '303', 
      } 
     ]; 
     return repos.map(function (repo) { 
      repo.value = repo.name.toLowerCase(); 
      return repo; 
     }); 
    } 
    /** 
    * Create filter function for a query string 
    */ 
    function createFilterFor(query) { 
     var lowercaseQuery = angular.lowercase(query); 
     return function filterFn(item) { 
      return (item.value.indexOf(lowercaseQuery) === 0); 
     }; 
    } 
} 

})(); 

Das ist mein html

<md-content layout-padding layout="column"> 
     <form ng-submit="$event.preventDefault()"> 

      <md-autocomplete ng-disabled="ctrl.isDisabled" 
          md-no-cache="ctrl.noCache" 
          md-selected-item="ctrl.selectedItem" 
          md-search-text-change="ctrl.searchTextChange(ctrl.searchText)" 
          md-search-text="ctrl.searchText" 
          md-selected-item-change="ctrl.selectedItemChange(item)" 
          md-items="item in ctrl.querySearch(ctrl.searchText)" 
          md-item-text="item.name" 
          md-min-length="0" 
          placeholder="Pick an Angular repository" 
          md-menu-class="autocomplete-custom-template"> 
       <md-item-template> 
        <span class="item-title"> 
         <md-icon md-svg-icon="img/icons/octicon-repo.svg"></md-icon> 
         <span> {{item.name}} </span> 
        </span> 
        <span class="item-metadata"> 
         <span class="item-metastat"> 
          <strong>{{item.watchers}}</strong> watchers 
         </span> 
         <span class="item-metastat"> 
          <strong>{{item.forks}}</strong> forks 
         </span> 
        </span> 
       </md-item-template> 
      </md-autocomplete> 
     </form> 
    </md-content> 

ich diesen Fehler nicht nachvollziehen kann bitte helfen

Answer 1

Sie sind nicht die ausgewählten Elemente instanziiert. .

self.selectedItem = [];