angular 動態添加input框

時間 2019-11-24

原文原文鏈接

 <!doctype html>
<html ng-app="myApp">
<head>
    <title>Angular - My Notes</title>

<body>
<h1>My Notes</h1>
<div ng-controller="Note">
    <div ng-repeat="item in items">
        <input type="text" placeholder="{{item.questionPlaceholder}}" ng-model="item.question">
        <input ng-class="{'blockInput': !item.inlineChecked}" type="text" placeholder="enter text..." ng-model="item.text">
        <input type="checkbox" name="check" value="inline" ng-model="item.inlineChecked"> Inline
    </div>
    <button ng-click="add()">New Item</button>
</div>

<script src="jslibs/angular-1.4.8/angular.min.js"></script>
<script type="text/javascript">
    var myApp = angular.module('myApp',[]);
    myApp.controller('Note', ['$scope', function($scope){
        $scope.items = [];

        $scope.add = function () {
            $scope.items.push({
                inlineChecked: false,
                question: "",
                questionPlaceholder: "foo",
                text: ""
            });
        };
    }]);


</script>
</body>
</html>

原文連接：http://www.4byte.cn/question/152/angularjs-how-to-dynamically-add-input-form.html#javascript

相關標籤/搜索