使用Angular.js,网页不显示提交的数据

时间:2015-10-21 22:53:21

标签: javascript html angularjs

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

app.controller('mainController',function($scope){
    $scope.posts=[];
    $scope.newPost={created_by:'', text:'', created_at:''};

    $scope.post=function(){
        $scope.newPost.created_at = Date.now();
        $scope.posts.push($scope.newPost);
        $scope.newPost={created_by:'', text:'', created_at:''};
    }
});
<!DOCTYPE html>

<html>
    <head>
    <title>Chirp</title>
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
    <script src="javascripts/chirpApp.js"></script>
    </head>
    <body>
        <div id='main' ng-controller="mainController">
            <form ng-Submit="post()">
                <input required type="text" placeholder="Your name" ng-model="newPost.created_by"/>
                <textarea required maxlength="300" rows="3" placeholder="say something" ng-model="newPost.text" ></textarea>
                <input class="button" type="submit" value="Chirp!"/>
            </form>
            <div id="post-stream">
                <h4>Chirp Feed</h4>
                    <!-- to be polulated by angular-->
                     <div class='post' ng-repeat="post in posts | orderBy:'created_at':true" ng-class-odd="'odd'" ng-class-even="'even'">

                     <p>{{post.created_by}} says {{post.text}} at {{post.created_at}}</p>

                    </div>
            </div>
        </div>
    </body>
</html>

我正在关注MEAN堆栈,但我无法显示表单提交的名称和文本。我是网络开发的新手,并且不知道它为什么不起作用

1 个答案:

答案 0 :(得分:1)

您可以尝试添加此

<html ng-app="chirpApp">