2

角度材のドロップダウンのラベルは更新されません。テキストボックスのラベルが更新されています。私はデモを行うためにjsフィドルを作成しました。彼らはあなたがドロップダウンをクリックして、何も角度材ドロップダウンラベルが角度変換なしで更新されない

https://jsfiddle.net/Anderson7301/suunyz3e/205/

var app = angular.module('ExpenseApp', [ 
    'ngMaterial', 
    'ngMessages', 
    'pascalprecht.translate' 
]) 


app.config(function($mdThemingProvider) { 
    // Configure a dark theme with primary foreground yellow 
    $mdThemingProvider.theme('docs-dark', 'default') 
    .primaryPalette('yellow') 
    .dark(); 
}); 


app.config(["$translateProvider", function($translateProvider) { 

    var en_translations = { 
    "LoadCreditCardExpenses": "Load Credit Card Expenses", 
    "employeeName": "Employee Name", 
    "EmployeeVendorNumber": "Employee Vendor Number", 
    "CostCenter": "Cost Center", 
    "Department": "Department", 
    "Manager": "Manager", 
    "TravelMonth": "Travel Month", 
    "TravelYear": "Travel Year", 
    "CreditCardBalanceDue": "Credit Card Balance Due", 
    "CashAdvance": "Cash Advance", 
    "Submit": "Submit", 
    "ExpenseReport": "Expense Report" 

    } 

    var sp_translations = { 
    "LoadCreditCardExpenses": "Los gastos de carga de tarjetas de crédito", 
    "employeeName": "nombre de empleado", 
    "EmployeeVendorNumber": "número de proveedor empleado", 
    "CostCenter": "centro de coste", 
    "Department": "Departamento", 
    "Manager": "Gerente", 
    "TravelMonth": "Mes del viaje", 
    "TravelYear": "Viaje año", 
    "CreditCardBalanceDue": "Tarjeta de crédito Debido Equilibrio", 
    "CashAdvance": "Adelanto en efectivo", 
    "Submit": "Enviar", 
    "ExpenseReport": "Informe de gastos" 


    } 

    $translateProvider.translations('en', en_translations); 

    $translateProvider.translations('sp', sp_translations); 

    $translateProvider.preferredLanguage('en'); 

}]); 

app.controller('headerCtrl', function($timeout, $scope, $translate) { 
    $scope.changeLanguage = function(lang) { 
    $translate.use(lang); 
    } 

    $scope.months = [ 
    "January", 
    "February", 
    "March", 
    "April", 
    "May", 
    "June", 
    "July", 
    "August", 
    "September", 
    "October", 
    "November", 
    "December" 
    ]; 


    var d = new Date(); 
    var currentYear = (d.getFullYear()); 
    var lastYear = (currentYear - 1); 

    $scope.years = [ 
    currentYear, 
    lastYear 
    ]; 
}) 

<body ng-app="ExpenseApp"> 
    <div layout="column" ng-cloak="" class="md-inline-form"> 
    <md-content md-theme="docs-dark" layout-gt-md="row" layout-padding=""> 
     <md-container> 
     <h2>{{'ExpenseReport' | translate}}</h2> 
     </md-container> 
    </md-content> 
    <md-content md-theme="docs-dark" layout-padding=""> 
     <div ng-controller="headerCtrl"> 
     <div layout-gt-md="row" layout-wrap> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'EmployeeVendorNumber' | translate}}</label> 
      <input ng-model="employees.SAPVendorNumber" readonly> 
      </md-input-container> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'CostCenter' | translate}}</label> 
      <input ng-model="employees.CostCenter" readonly> 
      </md-input-container> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'Department' | translate}}</label> 
      <input ng-model="employees.OrganizationalUnitName" readonly> 
      </md-input-container> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'Manager' | translate}}</label> 
      <input ng-model="employees.ManagerDisplayName" readonly> 
      </md-input-container> 
     </div> 
     <div layout-gt-sm="row" layout-wrap> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'TravelMonth' | translate}}</label> 
      <md-select ng-model="months"> 
       <md-option ng-repeat="month in months" value="{{month}}"> 
       {{month.name}} 
       </md-option> 
      </md-select> 
      </md-input-container> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'TravelYear' | translate}}</label> 
      <md-select ng-model="user.years"> 
       <md-option ng-repeat="year in years" value="{{year}}"> 
       {{year}} 
       </md-option> 
      </md-select> 
      </md-input-container> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'CreditCardBalanceDue' | translate}}</label> 
      <input ng-model="user.employeeCCBalanceDue" ng-pattern="/^[0-9]+([,.][0-9]+)?$/"> 
      </md-input-container> 
      <md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <label>{{'CashAdvance' | translate}}</label> 
      <input ng-model="user.employeeCashAdvance" readonly> 
      </md-input-container> 
      <md-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
      <md-button ng-click="alert()">{{'Submit' | translate}}</md-button> 
      <md-button>{{'LoadCreditCardExpenses' | translate}}</md-button> 
      </md-container> 
     </div> 
     <div> 
      <button ng-click="changeLanguage('en')">English</button> 
      <button ng-click="changeLanguage('sp')">Spanish</button> 
     </div> 
     </div> 
    </md-content> 
    </div> 
</body> 

答えて

2

を選択せず​​にオフにクリックした場合に更新を行うの周りの仕事を見つけました。にプレースホルダを追加すると、更新が許可されます。私は

https://jsfiddle.net/Anderson7301/suunyz3e/205/

<md-input-container class="md-block" flex-gt-sm="20" flex-sm="100"> 
<label>{{'TravelMonth' | translate}}</label> 
    <md-select ng-model="months" placeholder="{{'TravelMonth' | translate}}"> 
    <md-option ng-repeat="month in months" value="{{month}}"> 
     {{month.name}} 
    </md-option> 
    </md-select> 
</md-input-container> 
+0

DOM検査するとき、私は気づいた他の事は、ラベルが結ばれていることであるので、角度がバインドを翻訳ダウントラベル月降下を更新し、比較のために同じダウン旅行イヤードロップを残しましたmd-selectには "ng-binding md-placeholder"というクラスがありますが、他のラベルには "ng-binding"しかありません。間違いなく、マテリアルデザイン内のバグのようです。 –

関連する問題