AngularJS：我怎麼會去基於ID

Question

這已更新，並且是功能從陣列中選擇單行謝謝@ j.wittwer http://jsfiddle.net/wittwerj/2xjuh/

我試圖從選擇一行基於ID的帖子數組。選擇單個帖子後的目標是創建一個單一視圖，用戶可以在該視圖上對特定帖子發表評論。

我不確定最好的方法是什麼。我想過只是創建一個模型，但我不確定如何選擇一行來實現這一目標。我還需要使用表單控制器選擇它，以便我可以將數組發送回ajax，以便將它發佈到數組中。

我很抱歉，如果代碼是凌亂的firefox似乎不喜歡格式化堆棧適用。

這是我的JS代碼：（修訂版）

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

myApp.controller('FrmController', function ($scope, $http) { 
    $scope.visible = { 
     post: 1 
    }; 
    $scope.posts = [{ 
     id: 1, 
     content: 'Lorem ipsum dolor sit amet, eu laboramus persecuti cum, vel prompta ornatus democritum at, te alia partiendo pri. Ei quo sumo verear. Sed ad elitr aeterno disputationi, solum philosophia ex pro. Tempor essent prodesset in his, ne diam menandri vix, feugiat menandri ad cum.', 
     comment: ['first!!', 'second!!'] 
    }, { 
     id: 2, 
     content: 'Facilisi pertinacia an nec. Veniam nostro commune ei pro, in mazim labores disputationi nec, cu habeo ludus deleniti ius. Id eripuit adolescens vis, mei nemore copiosae referrentur id. Pro ut ubique delicatissimi.', 
     comment: ['great post!', 'tl;dr', 'interesting'] 
    }, { 
     id: 3, 
     content: 'Sed fugit error cu. In cetero albucius insolens pri, an sea velit altera constituto. Et perpetua splendide sed, te vel solum doming contentiones. Pro no omnes ridens liberavisse, ea pri tale cetero laoreet, pro te essent civibus assueverit. Assum essent appareat mei te, duo aeque consulatu et, te mel reque facilisis.', 
     comment: ['first to comment!'] 
    } ]; 
    $scope.btn_add = function (post, comment) { 
     if (comment != '') { 
      var IS_VALID = true; 
     } 

     if (IS_VALID) { 
      console.log("The form was sent"); 
      post.comment.push(comment); 
     } 
    } 

    $scope.remItem = function (post, $index) { 
     post.comment.splice($index, 1); 
    } 
}); 

HTML：（修訂版）

<div ng-controller="FrmController">choose a post ({{visible.post}} is visible) 
    <ul> 
     <li ng-repeat="post in posts" style="display: inline; list-style-type: none;"> 
      <input type="button" ng-click="visible.post = post.id" value="{{post.id}}" /> 
     </li> 
    </ul> 
    <div ng-repeat="post in posts" ng-if="visible.post == post.id">{{post.content}} 
     <form>Post your Comment (for post {{post.id}}) 
      <textarea ng-model="txtcomment" placeholder="Your Comment" style='width:550px'></textarea> 
      <button ng-click='btn_add(post, txtcomment);txtcomment = "";' style='margin-top:10px;'>Post Comment</button> 
      <h4>Comments</h4> 

      <ul> 
       <li ng-repeat="comnt in post.comment">{{ comnt }}<a style="float: right;" href="" ng-click="remItem(post, $index)">x</a> 

       </li> 
      </ul> 
     </form> 
    </div> 
</div> 

Answer 1

我能想到的最簡單的方法是讓ng-click設置一個變量，表示該文章是可見/正在被評論。然後在ng-if中使用該變量來顯示正確的帖子。

<ul> 
    <li ng-repeat="post in posts"> 
     <input type="button" ng-click="visible.post = post.id" value="{{post.id}}" /> 
    </li> 
</ul> 
<div ng-repeat="post in posts" ng-if="visible.post == post.id">{{post.content}} 
... 

這裏是一個工作演示：http://jsfiddle.net/wittwerj/2xjuh/