角度-從控制器中的指令獲取值

Question

我需要從我在多個地方使用的指令傳遞選定的值。 這是一個選擇輸入字段，我需要從中獲取選擇的值。

指令如下所示：

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;
      });
    }
  };
});

當我做console.log(scope.model); 我得到了所選的值，但是我不確定如何獲取它並在控制器中使用它？

這是控制器：

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);
    });
  };
});

Answer 1

您在作用域中已經具有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
}