angular.js - Bagaimana untuk memasukkan dan memadam elemen secara dinamik dalam angularjs
黄舟
黄舟 2017-05-15 17:10:00
0
2
679

Sama seperti ini, saya ingin menambah elemen<p class='main'></p> dalam html selepas menekan enter. Terdapat satu lagi soalan. Bagaimanakah angularjs mengendalikan DOM saya baru mula mempelajarinya dan saya tidak begitu memahaminya.
apl var = angular.module('myApp',[])

.controller('todoCtrl',function ($scope) {

    $scope.enterEvent = function(e) {
        var keycode = window.event?e.keyCode:e.which;
        if(keycode==13){

        }
    }
});
黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

membalas semua(2)
滿天的星座

Model dipacu data.
Anda perlu mengubah pemikiran anda tentang operasi dom.
Apa yang anda mahu lakukan selepas masuk Anda memerlukan satu dom lagi. Dengan mengandaikan bahawa nombor dom sebelumnya ialah 0, maka jika anda menekan Enter, ia akan menjadi +1.
Maka mudahlah anda menentukan pembolehubah terlebih dahulu sama ada dimulakan kepada 1 atau 10,000 bergantung pada mood anda.

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>JS Bin</title>
    <script src="//cdn.bootcss.com/angular.js/1.5.8/angular.min.js"></script>
</head>

<body ng-app="myApp">
    <p id="father" ng-controller="todoCtrl">

        <p>
            <input id="txt" type="text" ng-keyup="enterEvent($event)" value="">
        </p>
        <p ng-repeat="(i,item) in myDom" class='main'>我是第{{i+1}}个main {{myDom}}</p>
    </p>
</body>
<script>
    var app = angular.module('myApp', []);

    app.controller('todoCtrl', function($scope) {
        $scope.myDom = [];
        var i = 1;
        $scope.enterEvent = function(e) {
            var keycode = window.event ? e.keyCode : e.which;
            if (keycode == 13) {
                $scope.myDom.push(i)
                i++;
            }
        }

    });
</script>

</html>
某草草

Anda boleh masukkan <p class='main'></p>先写在页面上,写在todoCtrl ini. Kemudian tambahkan sintaks ngShow pada elemen untuk mengawal penyembunyian dan paparan elemen pada bila-bila masa:

<p class='main' ng-show="showMain"></p>
$scope.showMain=false;

$scope.enterEvent = function(e) {
    var keycode = window.event?e.keyCode:e.which;
    if(keycode==13){
        $scope.showMain=true;
    }
}
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan