Angularjs：検索フィルタが機能しているテーブルの他の行で機能していません

私はコードを書いています。ここでは、ng-repeatでテーブルを作った。 PHPでMySQLデータベースからデータを取得しました。検索フィルターがcalcTotal（名前）で機能していません。いくつかのキーワードを検索すると結果は正しく表示されますが、支払われた合計料金は変わりません。フィルタはその行で動作していません。誰かが異なる行や関数に同じフィルタを適用する方法を知っています。先入観を事前にAngularjs：検索フィルタが機能しているテーブルの他の行で機能していません

<script> 
       var app= angular.module("myapp",[]); 
       app.controller("mycontroller",function ($scope, $http) 
        //get data from database 
        { 
        $http.get("getData.php").then(function (response) { 
         $scope.names = response.data.records;}); 
         //subtraction between dates 
         $scope.CurrentDate=new Date(); 
         $scope.calDate = function(date1, date2){ 
          var dateOut1 = new Date(date1); 
          var dateOut2 = new Date(date2); 
          var timeDiff = Math.abs(dateOut2.getTime() - 
         dateOut1.getTime()); 

          var diffDays = Math.ceil(timeDiff/(1000 * 3600 * 24)); 
          return diffDays; 
         }; 
         $scope.getToday = function(){ 
          return new Date(); 
         } 
         //total fees paid 
           $scope.calcTotal = function(names){ 
            var sum = 0; 
            for(var i = 0 ; i<names.length ; i++){ 
            sum = sum + names[i].fpaid; 
            } 
           return sum; 
           }; 


        });  

</script> 
<body ng-app ="myapp" ng-controller="mycontroller"> 
     <p> 
      Search Here: <input type="text" placeholder="Search" ng- 
      model="searchText"> 
     </p> 
    <table border=1> 
       <tr> 

        <th >Name of student </th> 
        <th >Course Name </th> 
        <th >Course fees </th> 
        <th ></th> 
        <th>Balance Fees</th> 
        <th>Start Date of Course </th> 
        <th >End date of course</th> 
        <th> No of days </th> 
        <th>No of Days remaining </th> 

       </tr> 
        <tr ng-repeat="x in names | filter: searchText | orderBy:sortColumn"> 

         <td>{{x.Bank}}</td> 
         <td>{{x.cname}}</td> 
         <td >{{x.cfees}}</td> 
         <td>{{x.fpaid }}</td> 
         <td ng-model="bfess">{{x.cfees-x.fpaid}}</td> 
         <td>{{x.sdate | date:'dd-MM-yyyy'}}</td> 
         <td>{{x.edate | date:'dd-MM-yyyy'}}</td> 
         <td>{{calDate(x.edate,x.sdate)}}</td> 
         <td>{{calDate(x.edate,getToday()| date:'dd-MM-yyyy')}}</td>      
       </tr> 
       <tr> 
        <td>Total fess paid by students: {{ calcTotal(names) }}</td> 
       </tr> 

      </table>

出典

2017-12-10 Manisha Chavan

これは、フィルターされた配列ではなく、calcTotalの元の配列を使用しているためです。また、コントローラー内のフィルターを使用して、フィルターされた合計を計算することもできます。

あなたのコントローラ

controller('mycontroller', ['$scope', '$http','filterFilter', function FilterController($scope, $http,filterFilter)

にfilterFilterを注入し、計算

$scope.calcTotal = function(names){ 
    var filteredArray = filterFilter(names, $scope.searchText); 
    var sum = 0; 

    for(var i = 0 ; i<filteredArray.length ; i++){ 
     sum = sum + filteredArray[i].fpaid; 
    } 

    return sum; 
};

出典

2017-12-10 10:58:39 NTP

はTypeError前に、あなたの配列をフィルタリング：。ChildScope.FilterControllerで未定義のプロパティ '長さ' を読み込めません$ scope.calcTotalこのエラー発生しました –

私はあなたのfilteredArrayは未定義ですが、コードを見ずに推測するのは難しいと思います。私が何かを理解することができると確信しています。 – NTP

私はそのエラーを解決しました。本当にうまくいったのですか？ありがとうございました:) –

Angularjs：検索フィルタが機能しているテーブルの他の行で機能していません

答えて

関連する問題