2016-01-24 2 views
0

У меня есть предопределенные изображения, и я хочу создать spinner, где пользователь может выбрать эти элементы; но я хочу также кнопку выбора файла для пользовательских изображений.angularjs connect dropdown with fileselect

<div> 
    <select class="form-control" ng-model="inputQ.image"> 
    <!-- show if there is no image --> 
    <option disabled value="{{ undefined }}" 
      ng-hide="inputQ.image && !isImageFromSpinner(inputQ.image)"> 
     Nichts ausgewählt 
    </option> 
    <!-- show if there is a custom image --> 
    <option disabled 
      ng-show="inputQ.image && !isImageFromSpinner(inputQ.image)" 
      value="{{ isImageFromSpinner(inputQ.image) ? undefined : inputQ.image }}"> 
     Benutzerdefiniertes Bild ausgewählt 
    </option> 
    <option ng-repeat="res in exerciseRessources.images" 
      value="{{res.blob}}" ng-disabled="res.disabled"> 
     {{res.name}} 
    </option> 
    </select> 
    <br> 
</div> 
<div file-chooser ng-model="inputQ.image" accept="image/*"> 
    <img class="input" ng-src="{{inputQ.image}}" alt="Beispiel" 
     ng-show="inputQ.image"> 
    <br ng-show="inputQ.image"> 
    <button class="btn btn-default" file-select>Bild auswählen... 
    </button> 
    <button class="btn btn-default" file-unselect> 
    <span class="glyphicon glyphicon-trash"></span> 
    </button> 
</div> 

Я хочу обработать настраиваемое изображение в списке с помощью второго варианта, а первое для init.

, но функция isImageFromSpinner возвращает альтернативно true и false.

$scope.isImageFromSpinner = function (model) { 
    $scope.exerciseRessources.images.forEach(function (img) { 
     if (img.blob && img.blob === model) { 
      $log.warn(model, true); 
      return true; 
     } 
    }); 
    $log.warn(model, false); 
    return false; 
}; 

Если элемент находится в прядильщике, он должен быть истинным в противном случае ложным. Не true, false, true, ...
Поэтому неудивительно, что параметры выбора работают некорректно.

Знает ли кто-нибудь, почему я получаю это в качестве альтернативы истинным или ложным?

+0

Вы не можете использовать 'hide' в теге'

+0

спасибо за вход – rala

ответ

1
$scope.isImageFromSpinner = function (model) { 
    returnVal = false; 
    $scope.exerciseRessources.images.forEach(function (img) { 
     if (img.blob && img.blob === model) { 
      returnVal = true; 
      $log.warn(model, returnVal); 
      break; 
     } 
    }); 
    return returnVal; 
}; 
+1

действительно; так легко? и можете ли вы объяснить, почему? ^^ – rala

+1

ваш исходный код возвращается дважды, а второй всегда false. То, что вы действительно хотели сделать, это найти, есть ли какое-либо совпадение и немедленно выйти из цикла, а затем вернуть значение. Поэтому я просто немного изменил ваш код, чтобы сделать это. :-) –