亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Angular-Formly:在用戶單擊時動態添加表單字段

Angular-Formly:在用戶單擊時動態添加表單字段

墨色風雨 2019-12-05 13:19:23
我將如何在表單中添加功能,以便用戶可以通過單擊“添加”來添加更多輸入字段。這使用了角度正式庫。這是確切功能的示例,但僅使用angularjs完成。
查看完整描述

3 回答

?
慕桂英546537

TA貢獻1848條經驗 獲得超10個贊

看到這個柱塞

這是您所需要的示例。正如您在插件中看到的那樣,TextArea單擊按鈕時可以動態創建一個。單擊按鈕TextAreas也可以刪除創建的內容remove。


請參閱下面的HTML


<div class="col-sm-10">

  <input type="button" class="btn btn-info" ng-click="addNewChoice()" value="ADD QUESTION">

  <div class="col-sm-4">

    <fieldset data-ng-repeat="field in choiceSet.choices track by $index">

      <textarea rows="4" cols="50" ng-model=" choiceSet.choices[$index]"></textarea>

      <button type="button" class="btn btn-default btn-sm" ng-click="removeChoice($index)">

        <span class="glyphicon glyphicon-minus"></span> REMOVE

      </button>

    </fieldset>

  </div>

</div>

和JS將如下


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

app.controller('inspectionController', function($scope, $http) {

  $scope.choiceSet = {

    choices: []

  };

  $scope.quest = {};

  $scope.choiceSet.choices = [];

  $scope.addNewChoice = function() {

    $scope.choiceSet.choices.push('');

  };

  $scope.removeChoice = function(z) {

    $scope.choiceSet.choices.splice(z, 1);

  };

});


查看完整回答
反對 回復 2019-12-05
  • 3 回答
  • 0 關注
  • 784 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號