自動完成在AngularJS

Question

我想在我的形式看起來像添加自動完成：

<md-autocomplete required 
    md-input-name="pekerjaan" 
    md-selected-item="selectedCountry" 
    md-search-text="searchCountry" 
    md-items="item in query" 
    md-dropdown-position="bottom" 
    md-floating-label="Pekerjaan"> 

和我的控制器：

$scope.countries = [ "Albania","Andorra","Armenia","Austria","Azerbaijan","Belarus", 
        "Belgium","Bosnia & Herzegovina","Bulgaria","Croatia","Cyprus", 
        "Czech Republic","Denmark","Estonia","Finland","France","Georgia", 
        "Germany","Greece","Hungary","Iceland","Ireland","Italy","Kosovo", 
        "Latvia","Liechtenstein","Lithuania","Luxembourg","Macedonia","Malta", 
        "Moldova","Monaco","Montenegro","Netherlands","Norway","Poland", 
        "Portugal","Romania","Russia","San Marino","Serbia","Slovakia","Slovenia", 
        "Spain","Sweden","Switzerland","Turkey","Ukraine","United Kingdom","Vatican City"]; 

$scope.query = function(){ 

    $scope.countries 

} 

現在我想顯示除德國和奧地利，但我所有的國家不想在$ scope.countries中刪除它們。那我該怎麼做呢？感謝您的幫助

Answer 1

您可以使用過濾器動態跳過國家按照最佳做法。請拿來看到這個plnkr.co/edit/NqwW45ijaPqTaXDU21NP?p=preview

HTML代碼：

<div class="col-sm-5 hidden-xs"> 
     <div ng-repeat="country in countries | skipValues:skipCountries">{{country}}</div> 
    </div> 

JS文件：

var app = angular.module('plunker', []); 

app.controller('MainCtrl',function($scope){ 

    $scope.skipCountries = ["Germany","Austria"]; 
    $scope.countries = [ "Albania","Andorra","Armenia","Austria","Azerbaijan","Belarus", 
        "Belgium","Bosnia & Herzegovina","Bulgaria","Croatia","Cyprus", 
        "Czech Republic","Denmark","Estonia","Finland","France","Georgia", 
        "Germany","Greece","Hungary","Iceland","Ireland","Italy","Kosovo", 
        "Latvia","Liechtenstein","Lithuania","Luxembourg","Macedonia","Malta", 
        "Moldova","Monaco","Montenegro","Netherlands","Norway","Poland", 
        "Portugal","Romania","Russia","San Marino","Serbia","Slovakia","Slovenia", 
        "Spain","Sweden","Switzerland","Turkey","Ukraine","United Kingdom","Vatican City"]; 

}) 

app.filter('skipValues', function($filter) { 
    return function(items, values) { 
    return $filter('filter')(items, function(obj) { 
     return values.indexOf(obj) == -1; 
    }) 
    }; 
}); 

另外添加過濾器跳過的國家..

更新的代碼：

app.controller('MainCtrl',function($scope){ 

     $scope.skipCountries = ["Germany","Austria"]; 
     $scope.countries = [ "Albania","Andorra","Armenia","Austria","Azerbaijan","Belarus", 
         "Belgium","Bosnia & Herzegovina","Bulgaria","Croatia","Cyprus", 
         "Czech Republic","Denmark","Estonia","Finland","France","Georgia", 
         "Germany","Greece","Hungary","Iceland","Ireland","Italy","Kosovo", 
         "Latvia","Liechtenstein","Lithuania","Luxembourg","Macedonia","Malta", 
         "Moldova","Monaco","Montenegro","Netherlands","Norway","Poland", 
         "Portugal","Romania","Russia","San Marino","Serbia","Slovakia","Slovenia", 
         "Spain","Sweden","Switzerland","Turkey","Ukraine","United Kingdom","Vatican City"]; 

    $scope.query= function() { 
     return $filter('filter')($scope.countries, function(obj) { 
      return $scope.skipCountries.indexOf(obj) == -1; 
     }) 
    }; 

    })