D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
2947721120
Full window
Github gist
News Feed
<div ng-app="app" ng-controller="NewsCtrl as vm"> <div class="container"> <header id="header" class="row"> <div class="col-md-12"> <div class="well text-center"> <h1>新闻提要</h1> </div> </div> </header> <main class="row"> <!--Repeats over the posts array and then over it's comments--> <section class="col-md-6"> <div class="media" ng-repeat="post in vm.posts"> <div class="media-left"> <a href="#"> <img class="media-object" src="https://placeholdit.imgix.net/~text?w=100&h=100&txtsize=22&txt=%5Bimg%5D" alt="Generic placeholder image"> </a> </div> <div class="media-body"> <!--Keeps a property in the posts to control if the comments are displayed--> <h4 class="media-heading">{{post.author}}</h4> <p> {{post.text}}</p> <p>{{post.date | date:'medium'}}</p> <p class="small" ng-click="vm.showComments(post.id)"> {{post.comments.length}} 评论</p> <div ng-show="post.show"> <form name="formNewComment" novalidate> <fieldset class="form-group"> <textarea type="text" ng-model="vm.comm.comment" placeholder="Comment" required></textarea> </fieldset> <fieldset class="form-group"> <input type="text" ng-model="vm.comm.author" placeholder="Author" required/> </fieldset> <fieldset class="form-group"> <button class="btn btn-primary" type="submit" ng-click="vm.newComment(post.id, vm.comm)" ng-disabled="formNewComment.$pristine || formNewComment.$invalid "> 评论</button> </fieldset> </form> <div class="media" ng-repeat="comment in post.comments"> <div class="media-left"> <a href="#"> <img class="media-object" src="https://placeholdit.imgix.net/~text?w=100&h=100&txtsize=22&txt=%5Bimg%5D" alt="Generic placeholder image"> </a> </div> <div class="media-body"> <h4 class="media-heading">{{comment.author}}</h4> <p>{{comment.comment}}</p> </div> </div> </div> </div> </section> <section class="col-md-6"> <h4>New Post</h4> <form name="formNewPost" novalidate> <fieldset class="form-group"> <label for="description">Description</label> <textarea class="form-control" type="text" id="description" placeholder="Enter Post Description" ng-model="vm.input.text" required></textarea> </fieldset> <fieldset class="form-group"> <label for="postAuthor">Author</label> <input class="form-control" type="text" id="postAuthor" placeholder="Enter Your Name" ng-model="vm.input.author" required/> </fieldset> <fieldset class="form-group"> <button class="btn btn-primary" type="submit" ng-click="vm.newPost()" ng-disabled="formNewpost.$pristine || formNewPost.$invalid ">Submit</button> </fieldset> </form> </section> </main> </div> </div>