Angularjs 下拉选择值仅在angular js中的“添加”按钮上使用一次_Angularjs_Ng Repeat_Selectedindex

Angularjs 下拉选择值仅在angular js中的“添加”按钮上使用一次

angularjs

Angularjs 下拉选择值仅在angular js中的“添加”按钮上使用一次,angularjs,ng-repeat,selectedindex,Angularjs,Ng Repeat,Selectedindex,单击“添加”按钮时，应从下拉列表中选择的值应添加，只有一次该值应添加到结果字段中。有人能帮我一把。下面是我试过的代码 function ContactController($scope) { $scope.contacts = ["Apple"]; $scope.curItem = [{ id: "1", items: "Apple" }, { id: "2", items: "Orange" }, { id: "3", ite

单击“添加”按钮时，应从下拉列表中选择的值应添加，只有一次该值应添加到结果字段中。有人能帮我一把。下面是我试过的代码

function ContactController($scope) {
 $scope.contacts = ["Apple"];
 $scope.curItem = [{
     id: "1",
     items: "Apple"
 }, {
     id: "2",
     items: "Orange"
 }, {
     id: "3",
     items: "Banana"
 }, {
     id: "4",
     items: "Apricot"
 }, {
     id: "5",
     items: "Asparagus"
 }, ];
 $scope.selectedItem = $scope.curItem[0];

}

视图：

<table class="range-table" width="100%">
    <tr>
        <td>
            <input type="hidden">
            <button class="btn btn-link" value= "Save">
                <span class="glyphicon glyphicon-plus"></span>
            </button>
        </td>
        <td>
            <select required="" style="min-width:180px;"> </select>
        </td>
    </tr>
</table>

<table class="range-table" width="100%">
    <tr>
        <td ng-repeat="contact in contacts"> <td>{{ contact }}</td> 
    </tr>
</table>


{{contact}}

HTML：

    <body ng-controller="MainCtrl">


        <table class="range-table" width="100%"> 
         <tr> 
            <td><input type="hidden"> <button class="btn btn-link" ng-click="save(selectedItem)">Save</button> </td> 
            <td><select ng-model="selectedItem" ng-options="i.items as i.items for i in curItem" ng-init="selectedItem=curItem[0].id"></select></td> </tr> 
</table> 
<table class="range-table" width="100%"> 
          <tr> 
          <tr ng-repeat="contact in contacts track by $index">
             <td>{{ contact }}</td> 
          </tr>
 </table>

</body>


拯救
{{contact}}

Javascript（您的控制器代码）：

app.controller（'MainCtrl'，函数（$scope）{
$scope.contacts=[“苹果”]；
$scope.curItem=[{id:“1”，items:“苹果”}，{id:“2”，items:“橙色”}，{id:“3”，items:“香蕉”}，{id:“4”，items:“杏子”}，{id:“5”，items:“芦笋”}]；
$scope.save=函数（i）{
如果（$scope.contacts.indexOf（i）我已经创建了一个
选中“其他选项”单选按钮时，应启用文本框
JS:
HTML:


节目：
选择1
选择2
其他

您在“下面”没有提供任何代码“…如何将代码嵌入到satck overflow中？”{{{contact}}我已经完成了以下步骤：这是您想要实现的吗？非常感谢..Tomislav..：）：）
app.controller('MainCtrl', function($scope) {
  $scope.contacts = ["Apple"]; 

  $scope.curItem=[{id:"1",items:"Apple"}, {id:"2",items:"Orange"}, {id:"3",items:"Banana"}, {id:"4",items:"Apricot"}, {id:"5",items:"Asparagus"}]; 
  $scope.save=function(i){
    if ($scope.contacts.indexOf(i) <= -1){
     $scope.contacts.push(i);
    }
  };
});

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.$watch('form.Program', function(mVal){
    if (angular.isUndefined($scope.form)) return; 

    if(mVal === 'other'){
       $scope.form.OtherProgram = $scope.tmVar;
    } else {
      if($scope.form.OtherProgram !== null){
        $scope.tmVar = $scope.form.OtherProgram;
         $scope.form.OtherProgram = null;
      }
     }
  });
});

<body ng-controller="MainCtrl">
    <p>
        Program:
        <label><input type="radio" ng-model="form.Program" name="Program" value="option 1" required /> option 1</label>
        <label><input type="radio" ng-model="form.Program" name="Program" value="option 2" required /> option 2</label>
        <label><input type="radio" ng-model="form.Program" name="Program" value="other" required /> other</label>
        <input type="text" ng-model="form.OtherProgram" ng-disabled="form.Program != 'other'" name="Program_Other"  ng-required ="form.Program != 'other'"/>
    </p>
</body>