2016-09-21 4 views
0

여러 위치에서 사용중인 지시어에서 선택한 값을 전달해야합니다. 선택한 값을 가져와야하는 선택 입력 필드입니다.컨트롤러의 지시문에서 각도 값 가져 오기

지시어가 같은 모습입니다 : 내가 console.log(scope.model); 내가 선택한 가치를 수행 할 때

angular.module('quiz.directives') 
.directive('fancySelect', function($rootScope, $timeout) { 
    return { 
    restrict: 'E', 
    templateUrl: 'templates/directives/fancySelect.html', 
    scope: { 
     title: '@', 
     model: '=', 
     options: '=', 
     multiple: '=', 
     enable: '=', 
     onChange: '&', 
     class: '@' 
    }, 
    link: function(scope) { 
     scope.showOptions = false; 
     scope.displayValues = []; 

     scope.$watch('enable', function(enable) { 
     if (!enable && scope.showOptions) { 
      scope.toggleShowOptions(false); 
     } 
     }); 

     scope.toggleShowOptions = function(show) { 
     if (!scope.enable) { 
      return; 
     } 

     if (show === undefined) { 
      show = !scope.showOptions; 
     } 

     if (show) { 
      $rootScope.$broadcast('fancySelect:hideAll'); 
     } 

     $timeout(function() { 
      scope.showOptions = show; 
     }); 
     }; 

     scope.toggleValue = function(value) { 
     if (!value) { 
      return; 
     } 

     if (!scope.multiple) { 
      scope.model = value; 
      console.log(scope.model); 
      return; 
     } 

     var index = scope.model.indexOf(value); 
     if (index >= 0) { 
      scope.model.splice(index, 1); 
     } 
     else { 
      scope.model.push(value); 
     } 

     if (scope.onChange) { 
      scope.onChange(); 
     } 
     }; 

     scope.getDisplayValues = function() { 
     if (!scope.options || !scope.model) { 
      return []; 
     } 

     if (!scope.multiple && scope.model) { 
      return scope.options.filter(function(opt) { 
      return opt.id == scope.model; 
      }); 
     } 

     return scope.options.filter(function(opt) { 
      return scope.model.indexOf(opt.id) >= 0; 
     }); 
     }; 

     $rootScope.$on('fancySelect:hideAll', function() { 
     scope.showOptions = false; 
     }); 
    } 
    }; 
}); 

,하지만 난 그것을 얻을 내 컨트롤러에서 사용하는 방법을 확실하지 않다?

이것은 컨트롤러 :

angular.module('quiz.controllers') 
.controller('ProfileController', function(
    $scope, 
    $state, 
    $stateParams, 
    UserService, 
    $auth, 
    MessageService, 
    $ionicLoading, 
    AppSettings, 
    $timeout, 
    AvatarService, 
    PushService, 
    $http 
) { 
    $scope.user = UserService.get(); 
    $scope.profilePromise = {}; 

    if ($scope.user.player.avatar == ""){ 
    $scope.user.player.avatar = AvatarService.getRandom(); 
    } 

    $http.get(AppSettings.apiUrl + '/years') 
    .then(function(result) { 
     $scope.years = result.data; 
    }); 

    $scope.updateUser = function(form) { 
    if (!form.$valid) { 
     var message = "Ugyldig data i skjema. Sjekk felter markert med rødt."; 
     MessageService.alertMessage(message); 
     return; 
    } 

    saveUser($scope.user); 
    }; 

    $scope.getNextAvatar = function() { 
    $scope.user.player.avatar = AvatarService.getNext($scope.user.player.avatar); 
    }; 

    $scope.getPreviousAvatar = function() { 
    $scope.user.player.avatar = AvatarService.getPrevious($scope.user.player.avatar); 
    }; 

    var saveUser = function(user) { 
    $scope.profilePromise = UserService.save(user); 

    $scope.profilePromise.then(function(result) { 
     $scope.user = result.data.user; 

     PushService.init(); 
     PushService.getDeviceId().then(function(id) { 
     UserService.addDevice(id); 
     }); 

     if ($stateParams.register) { 
     $state.go('main.front'); 
     } 
    }, function(error) { 
     var message = "Kunne ikke lagre bruker. Melding fra server: " + error.data.message; 
     MessageService.alertMessage(message); 
    }); 
    }; 
}); 
+0

을 내가 왜'onChange' 기능을 참조 값 ('scope.onChange ({$ value : scope.model});')을 입력하지 않은 상태에서 컨트롤러 함수를 지시문에 전달하십시오. myCtrl.onChange ($ value) "> – devqon

답변

0

당신은 이미 onChange 범위에 바인딩이, 왜 당신은 하나를 사용하지 않는? 당신의 지시에

:

if (scope.onChange) { 
    scope.onChange({ $value: scope.model }); 
} 

는 그런 다음 지시에 컨트롤러 기능을 전달합니다

<fancy-select on-change="onChange($value)"></fancy-select> 

를 컨트롤러에서 :

$scope.onChange = function(val) { 
    // do something with the value 
} 
+0

제안 할 때 했었지만 console.log (val)를 $로 사용하면 val의 값을 얻지 못합니다. 내 컨트롤러의 scope.onChange 함수 – Marco

+0

지시어에서'scope.onChange'가 실행되었음을 확인할 수 있습니까? – devqon

+0

아니요, 트리거되지 않습니다 – Marco

관련 문제