bestsource

각도 물질에 다중 선택 옵션을 구현하려면 어떻게 해야 합니까?

bestsource 2023. 10. 21. 10:36
반응형

각도 물질에 다중 선택 옵션을 구현하려면 어떻게 해야 합니까?

서류와 데모를 확인했지만 아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아아!!각도-재료를 사용하여 선택 2와 같은 다중 선택 옵션을 구현하는 것에 대한 참조를 찾지 못했습니다.어떻게 작동하는지 알려주실 분 있나요?

스팍타의 대답은 정확합니다. md-select여러 개를 추가하면 됩니다.

작업 솔루션 코드: http://codepen.io/ansgar-john/pen/RWPVEO?editors=101

HTML

<div>
  <md-input-container>
    <md-select multiple ng-model="ctrl.likedAnimals" placeholder="please select">
      <md-option ng-repeat="a in ctrl.animals" value="{{a}}">{{a}}</md-option>
    </md-select>
  </md-input-container>
</div>

JS

(function () {
  'use strict';
  angular
      .module('MyApp')
      .controller('AppCtrl', function($scope) {
        this.likedAnimals = ["mouse", "dog"];
        this.animals = ["mouse", "dog", "cat", "bird"];
  });
})();

스택 오버플로 응답 기반 코드:각도 물질에 다중 선택 옵션을 구현하려면 어떻게 해야 합니까?

사용 설명서는 여기에서 확인하실 수 있습니다.

특성

multiple (옵션): boolean - multiple인지 여부.

<md-select ng-model="someModel" placeholder="Select a state" multiple="true">
    <md-option ng-value="opt" ng-repeat="opt in neighborhoods2">{{ opt }}</md-option>
</md-select>

이게 안 되면 저도 그 얘기를 들어봤습니다.md-multiple작동할 수도 있지만 문서는 아직 업데이트되지 않았습니다.아직 확인을 못 했는데요.

체크아웃

사용자 정의 템플릿을 적용할 수도 있습니다.

다음을 사용하여 다중인 일부 md-select와 함께 ng-repeat을 사용할 수 있도록 허용했습니다(각 1.4.7 기준).

색인을 보다

<md-input-container ng-repeat="item in items track by $index">
        <label>{{item.title}}</label>
            <div ng-include="item.multiselect == 'true' ? 'm_selectfragment.html' : 's_selectfragment.html'"></div>
   </md-input-container>

자바스크립트

$scope.items = 
        [{title: 'funny',
        selected: '', 
        names: [
            {name: 'some name'}, 
            {name: 'other name'},
            {name: 'more?'}, 
            {name: 'say wha???'}             
            ],
         multiselect: "false"   
        }, 
        {title: 'serious', 
        selected: '', 
        names: [
           {name: 'Obama'},
        {name: 'Trump'},
        {name: 'Hillary'},
        {name: 'Putin'}               
            ],
         multiselect: "true"   
        }];

m_프래그먼트를 선택합니다.

<md-select name="item.title" ng-model="item.selected" multiple="true">
<md-option ng-repeat="name in item.names" value="{{name.name}}">{{name.name}}
</md-option>

s_프래그먼트를 선택합니다.

<md-select name="item.title" ng-model="item.selected">
<md-option ng-repeat="name in item.names" value="{{name.name}}">{{name.name}}
</md-option>

언급URL : https://stackoverflow.com/questions/28655946/how-am-i-supposed-to-implement-multiple-select-option-in-angular-material

반응형