각도 재료 md 선택 항목이 창 다시로드시 저장되지 않음

Question

사용자가 작업 진행률을 선택해야하는 곳의 드롭 다운 목록이 있습니다. 진행 상황은 항상 채워 져야하므로 비워 둘 수 없습니다. 문제는 컨트롤러에서 서비스의 진행 정보를 가져오고 설정할 수 없다는 것입니다. 나는 md-select 드롭 다운 목록을 초기 진행 상태로 만들고 뒤에 새로운 상태를 가져 오는 로직을 이해하는데 문제가 있음을 인정한다. Angular Material 사이트에서 md-select 지시어를 살펴 보았지만 초기/기본값에 대한 정보가 아니라 md-on-open 및 md-on-close에 대한 명확한 지침을 제공합니다. 그것은 도구 모음에 포함되어

<md-toolbar style="background-color: #e6e3f4"> 
    <div style="display: flex; flex-direction: row"> 
     <span flex></span> 
     <md-input-container style="margin: 1px;" ng-controller="SelectOptGroupController"> 
      <md-select ng-model="progress"> 
       <md-option ng-repeat="progress in progresses" value="{{progress}}">{{progress}}</md-option> 
      </md-select> 
     </md-input-container> 
    </div> 
    </md-toolbar> 

그 어떤 차이가 아닌지, 나도 몰라 : 그래서 여기 내 템플릿에 내 MD-선택 코드입니다.

angular 
.module('myApp') 
.controller('SelectOptGroupController', ['$scope', '$mdDialog', '$stateParams', 'ScorecardStatus', function($scope, $mdDialog, $stateParams, ScorecardStatus) { 
$scope.employee.id = $stateParams.employeeid; 
$scope.employee.startDate = $stateParams.startdate; 
$scope.employee.endDate = $stateParams.enddate; 

    $scope.progresses = [ 
     "Not started", 
     "In progress", 
     "Quality analysis finished", 
     "Sent for review", 
     "Completed" 
    ]; 


    $scope.getSelectedProgress = function(progress){ 
     getProgress().then(function(progress){ 
      $scope.progress = progress; 
     }) 
    } 
    //console.log($scope.progress); 

}])

을 그리고 여기에와 데이터베이스에서 전화를 거는 서비스의 :

컨트롤러는 다음과 같습니다

angular 
    .module('myApp') 
    .factory('ScorecardStatus', function($http,$rootScope,$q){ 
     var progress; 

     function setProgress() { 
       $http({ 
        method: 'POST', 
        url: 'php/setScorecardProgress.php', 
        data: {status: selectedStatus, id: employee.id, startdate: employee.startDate, enddate: employee.endDate} 
      }); 
     } 

     function getProgress() { 
      if (!progress) 
       $http({ 
        method: 'GET', 
        url: 'php/getScorecardProgress.php' 
      }); 

      return progress; 
     } 

     return { 
      getProgress: getProgress 
     } 

}); 

감사합니다!

Answer 1

md-select에 사용중인 progress 각각에 대해 id을 정의하십시오. 위의 예에서 알 수 있듯이 id은 각각 progress에 해당하므로 고유 한 진행률은 id으로 확인할 수 있습니다. 페이지가로드 될 때 id을 선택하여 progress 모델을 정의하십시오. 여기 JS

.controller('TempController', function($scope) { 
$scope.progress = 2; 
$scope.progresses = [ 
    { 
    name: "Not started", 
    id: 0 
    }, 
    { 
    name: "In progress", 
    id: 1 
    }, 
    { 
    name: "Quality analysis finished", 
    id: 2 
    }, 
    { 
    name: "Sent for review", 
    id: 3 
    }, 
    { 
    name: "Completed", 
    id: 4 
    } 
]; 
}); 

<md-toolbar> 
    <div layout="row" layout-aling="end center"> 
    <span flex></span> 
    <md-input-container> 
     <md-select ng-model="progress"> 
     <md-option ng-repeat="progress in progresses" value="{{progress.id}}">{{progress.name}}</md-option> 
     </md-select> 
    </md-input-container> 
    </div> 
</md-toolbar> 

는 wokring 예이다. http://codepen.io/next1/pen/zBNRMe