Как добавить условный атрибут add html?

Как добавить условный атрибут в angularjs?Как добавить условный атрибут add html?

Например, я хочу установить атрибут multiple на <select>, если у моего компонента установлена привязка к true. Это означает, что если привязка не указана, для моего <select> не должно существовать несколько атрибутов.

Единственное решение, которое я нашел, было с ng-if.

источник

2016-10-21 tiktak

Возможный дубликат [Что это лучший способ условно применить атрибуты Угловая?] (Http://stackoverflow.com/questions/15696416/what-is-the-best- путь-к-условно-apply-attributes-in-angle) – ksav

использовать ng-if, ng-show ... – Jigar7521

Вы пытались с несколькими = "{{yourVar}}"? –

если логическое condition верно, то несколько, еще не

<select ng-if="condition" ng-model="some.model" multiple></select> 
<select ng-if="!condition" ng-model="some.model"></select> 


<select ng-show="condition" ng-model="some.model" multiple></select> 
<select ng-hide="condition" ng-model="some.model"></select>

контроллер,

$scope.condition = true

источник

2016-10-21 12:27:32 Sravan

Вы можете добиться этого путем реализации директивы (ака ng-multiple) для обработки свойства multiple из элемент select. Следующий фрагмент реализует это решение. Однако вы можете контролировать состояние своей модели внутри этого directive, как только multiple prop создаст массив выбранных значений, non-multiple будет создавать один объект, поэтому это может вызвать проблему при переключении между multiple и non-multiple.

angular.module('myApp', []) 
 
    .directive('ngMultiple', function() { 
 
    return { 
 
     require: ['select', '?ngModel'], 
 
     restrict: 'A', 
 
     scope: { 
 
     multiple: '=ngMultiple' 
 
     }, 
 
     link: function (scope, element, attrs, ctrls) { 
 
     
 
     element.prop('multiple', scope.multiple); 
 
     
 
     scope.$watch('multiple', function (multiple) { 
 
      if(element.prop('multiple') != multiple){ 
 
      // may be would be convenient change the ngModel 
 
      // to [] or {} depending on the scenario 
 
      element.prop('multiple', multiple); 
 
      } 
 
     }); 
 
     } 
 
    }; 
 
    }) 
 
    .controller('myController', function ($scope) { 
 
    $scope.condition = true; 
 
    $scope.myOptions = []; 
 
    }); 
 

 
angular.element(document).ready(function() { 
 
    angular.bootstrap(document, ['myApp']); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<div ng-controller="myController"> 
 
    <label> 
 
    <input type="checkbox" ng-model="condition" /> multiple? 
 
    </label> 
 
    <br> 
 
    <select ng-multiple="condition" ng-model="myOptions"> 
 
    <option>Option 1</option> 
 
    <option>Option 2</option> 
 
    <option>Option 3</option> 
 
    <option>Option 4</option> 
 
    <option>Option 5</option> 
 
    </select> 
 
    <br> 
 
    <tt>myOptions: {{ myOptions }}</tt> 
 
</div>

источник

2016-10-21 13:14:26

Как добавить условный атрибут add html?

ответ

Смежные вопросы