如何在Angularjs中使用按钮点击指令创建选择选项

How to create select option using directives on button click in Angularjs

本文关键字：指令 创建 选项 选择 按钮 Angularjs      更新时间：2023-09-26

我想知道当我已经使用此列表渲染select标记时，如何复制它。。

var lists = [{name: "blue"},{name: "green"},{name: "red"},{name: "yellow"}]

并且有一个添加按钮来复制这个选择标签。

我为此创作了小提琴：http://jsfiddle.net/rdy4e4xx/

我正在考虑使用指令，但我不知道从哪里开始。谢谢大家。

我想你正在寻找这样的东西（更新）：

HTML:

  <div ng-controller="ListsCtrl">
        {{ mySizes }}
        <select ng-model="selectTag.value"  ng-repeat="selectTag in selectTags">
            <option value="">- - Make Selection - -</option>
            <option ng-repeat="size in sizes" value="{{ size.name }}">{{ size.name}}</option>
        </select>
      <button type="button" ng-click="duplicateSelectTag()">Duplicate Select Tags</button>
      Selected values:
      <ul ng-repeat="selectTag in selectTags">
          <li>{{selectTag.value}}</li>
      </ul>
    </div>

JS:

var app = angular.module("app",[]);
app.controller('ListsCtrl',function($scope){
   $scope.sizes = [{name: "blue"},{name: "green"},{name: "red"},{name: "yellow"}]; 
    $scope.selectTags=[{
        value:null
    }];
    $scope.duplicateSelectTag = function() {
        $scope.selectTags.push({});
    }
});

演示

我想你正在寻找这个

  <div ng-controller="ListsCtrl">
        {{ mySizes }}
        <select ng-model="mySizes">
            <option value="">- - Make Selection - -</option>
            <option ng-repeat="size in sizes" value="{{ size.name }}">{{ size.name}}</option>
        </select>
     <button ng-click="dupplicate(mySizes)">Duplicate Select Tags</button>
  </div>
var app = angular.module("app",[]);
app.controller('ListsCtrl',function($scope){
    $scope.sizes = [{name: "blue"},{name: "green"},{name: "red"},{name: "yellow"}]; 
    $scope.dupplicate = function(mySizes){       
        $scope.sizes.push({name: mySizes});
    };
});
相关文章：