AngularJS 动态添加展示数据

AngularJS 动态添加展示数据

2017/11/10 9:35:17


效果

代码


    
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Titletitle>

        <style type="text/css">

            table {
                margin: 10px;
            }


        style>

        <script type="text/javascript" src="js/angular.min.js">script>

        <script type="text/javascript">

            var app = angular.module("MS", []);

            app.controller("mscontroller", ["$scope", function ($scope) {

                //数据源
                $scope.datas = new Array();

                /**
                 *  往数组里面添加数据
                 */
                $scope.savedata = function () {

                    $scope.datas.unshift($scope.newsdata);
                    $scope.newsdata = "";
                }

            }])


        script>

    head>
    <body ng-app="MS" ng-controller="mscontroller">
    <div>
        <form ng-submit="savedata()">
            <fieldset>
                <legend>添加legend>
                <label>请输入:label>
                <input type="text" ng-model="newsdata"/>
            fieldset>
        form>

        <table border="1px">
            

            

            
            <tr ng-repeat="item in datas track by $index">

                <td>{{item}}td>

            tr>

        table>
    div>

    body>
    html>

可能会遇到的错误

解决方案

在对应的ng-repeat指令中增加track by $index

你可能感兴趣的:(AngularJS 动态添加展示数据)