2016-10-24 4 views
0

Приветствую, что я немного новичок в использовании md-select и md-options и столкнулся с небольшим количеством дорожного блока. Мне нужно изменить значение, основанное на том, что если выбрано значение из параметра md-option и установлено значение true, и если он не возвращает значение false. Однако, я немного потерял, как это сделать, и мог бы использовать какое-то направление. В настоящее время я пытаюсь запустить функцию, которая меняет это значение, но я не могу понять, как передать правильный объект.Md-select & Md-options Использование нескольких значений свопинга AngularJS Angular Material

Я думаю, что мне что-то не хватает логически с помощью md-options и md-select любая помощь приветствуется.

//Array of objects in ng-repeat 
var vm= $scope; 
    vm.metricsArr = [ 
    {id: 0, name:"Aircraft Commander", valId:false}, 
    {id: 1, name:"Flight Hours", valId: false}, 
    {id: 2, name:"# of Sorties", valId: false}]; 

//Change value 
vm.changeMetrics = function(passedInParam){ 
//nothing in here since I cant get it to work currently 
}; 

//HTML where i pass object in to change value 
<md-select multiple ng-model="i" ng-model-options= "{trackBy: '$value.id'}" ng-change="changeMetricVal(i);"> 
       <md-option ng-value="i" ng-repeat="i in metricsArr"> 
        {{i.name}} 
       </md-option> 
       </md-select> 

ответ

0

По какой-то причине ng-change не дозвонились (я, кажется, помню, встретив эту проблему, прежде чем с md-select). Что вы можете сделать, это использовать $scope.$watch - CodePen

Markup

<div ng-controller="AppCtrl as vm" ng-cloak="" ng-app="MyApp"> 
    <md-select multiple ng-model="i" ng-model-options= "{trackBy: '$value.id'}" aria-label="Select"> 
    <md-option ng-value="i" ng-repeat="i in vm.metricsArr"> 
     {{i.name}} 
    </md-option> 
    </md-select> 
</div> 

JS

angular.module('MyApp',['ngMaterial']) 

.controller('AppCtrl', function($scope) { 
    var vm = this; 
    vm.metricsArr = [ 
    {id: 0, name:"Aircraft Commander", valId:false}, 
    {id: 1, name:"Flight Hours", valId: false}, 
    {id: 2, name:"# of Sorties", valId: false}]; 

    $scope.$watch("i", function (newValue) { 
    console.log(newValue); 
    }); 
});