默認值爲md-autocomplete

如何在md-autocomplete中傳遞默認值？默認值爲md-autocomplete

圖片1：HTML代碼圖片2：JS代碼圖片3：輸出

正如你所看到的，我沒有得到任何默認國家作爲輸出。有沒有辦法做到這一點？

enter image description here

2015-05-06 rosinghal

我用超時來做到這一點。

$timeout(function() { 
     $scope.local = {selectedItem : 1} 
    }, 2000);

來源

2015-05-06 14:00:46 rosinghal

分配年SEARCHTEXT默認值& selectedItem屬性的對象。

$scope.local ={ 
    ... 
    searchText : 'Default Value', 
    selectedItem : 'Default object' 
    ... 
}

來源

2015-05-06 08:20:16 nitin

並沒有對我的工作 – Sara

我寫了自動完成和默認值的小codepen。你必須做什麼：

初始主要模型。
定義模型字段，用於自動完成md-selected-item屬性。
定義加載自動填充項目的回調。
保存主模型從相關字段中提取id（或其他字段）之前。在你的代碼

主要錯誤在這裏：

$scope.local = { 
    ... 
    selectedItem: 1, // Must be object, but not integer 
    ... 
}

(function(A) { 
 
    "use strict"; 
 

 
    var app = A.module('app', ['ngMaterial']); 
 

 
    function main(
 
    $q, 
 
    $scope, 
 
    $timeout 
 
) { 
 
    $timeout(function() { 
 
     $scope.user = { 
 
     firstname: "Maxim", 
 
     lastname: "Dunaevsky", 
 
     group: { 
 
      id: 1, 
 
      title: "Administrator" 
 
     } 
 
     }; 
 
    }, 500); 
 

 
    $scope.loadGroups = function(filterText) { 
 
     var d = $q.defer(), 
 
     allItems = [{ 
 
      id: 1, 
 
      title: 'Administrator' 
 
     }, { 
 
      id: 2, 
 
      title: 'Manager' 
 
     }, { 
 
      id: 3, 
 
      title: 'Moderator' 
 
     }, { 
 
      id: 4, 
 
      title: 'VIP-User' 
 
     }, { 
 
      id: 5, 
 
      title: 'Standard user' 
 
     }]; 
 

 
     $timeout(function() { 
 
     var items = []; 
 

 
     A.forEach(allItems, function(item) { 
 
      if (item.title.indexOf(filterText) > -1) { 
 
      items.push(item); 
 
      } 
 
     }); 
 

 
     d.resolve(items); 
 
     }, 1000); 
 

 
     return d.promise; 
 
    }; 
 
    } 
 

 
    main.$inject = [ 
 
    '$q', 
 
    '$scope', 
 
    '$timeout' 
 
    ]; 
 

 
    app.controller('Main', main); 
 
}(this.angular));

<head> 
 
    <link href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/0.11.0/angular-material.min.css" rel="stylesheet" /> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-aria.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-animate.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/0.11.0/angular-material.min.js"></script> 
 

 
</head> 
 

 
<body ng-app="app" flex layout="column" layout-margin ng-controller="Main"> 
 
    <md-content layout="column" class="md-whiteframe-z1" layout-margin> 
 
    <md-toolbar> 
 
     <div class="md-toolbar-tools"> 
 
     <h3>Form</h3> 
 
     </div> 
 
    </md-toolbar> 
 
    <md-content class="md-whiteframe-z1"> 
 
     <div class="md-padding"> 
 
     <md-input-container> 
 
      <label for="firstname">First name</label> 
 
      <input type="text" name="firstname" ng-model="user.firstname" /> 
 
     </md-input-container> 
 
     <md-input-container> 
 
      <label for="lastname">Last name</label> 
 
      <input type="text" name="lastname" ng-model="user.lastname" /> 
 
     </md-input-container> 
 
     <md-autocomplete md-selected-item="user.group" md-items="item in loadGroups(filterText)" md-item-text="item.title" md-search-text="filterText"> 
 
      <md-item-template>{{ item.title }}</md-item-template> 
 
      <md-not-found>No items.</md-not-found> 
 
     </md-autocomplete> 
 
     </div> 
 
    </md-content> 
 
    </md-content> 
 
    <md-content class="md-whiteframe-z1" layout-margin> 
 
    <md-toolbar> 
 
     <div class="md-toolbar-tools"> 
 
     <h3>Model as JSON</h3> 
 
     </div> 
 
    </md-toolbar> 
 
    <md-content class="md-padding"> 
 
     <p> 
 
     {{ user | json }} 
 
     </p> 
 
    </md-content> 
 
    </md-content> 
 
</body>

來源

2015-09-22 11:58:03

默認值爲md-autocomplete

回答

相關問題