javascript - Angular - display table rows with empty values (TypeError: Cannot read property 'length' of undefined) -


i have following in view displaying table of data in nested ng-repeat.

what show rows empty cells (<textarea>) - when link clicked apply filter. text of link should change show data', when clicked again revert showing data.

<a class="btn btn-primary" href="#" ng-click="view.applymissingvaluesfilter(view.missingvaluesbuttontext)">{{view.missingvaluesbuttontext}}</a>  <table class="table">     <tr>         <th>resource id</th>         <th ng-repeat="locale in view.resourcegridresources.locales">             {{locale ? locale : "invariant" }}         </th>     </tr>     <tr ng-repeat="resource in view.resourcegridresources.resources">         <td>{{resource.resourceid}}</td>         <td ng-repeat="res in resource.resources">             <textarea ng-model="res.value"                       ng-blur="view.savegridresource(res)"                       style="min-width: 300px"></textarea>         </td>      </tr> </table> 

i have tried following locic in controller - try , show rows empty data initally:

vm.applymissingvaluesfilter = function (linktext) {          var results = [];          var temp = vm.resourcegridresources.resources;          (var = 0; < temp.length; i++) {             (var j = 0; j < temp[i].resources.length; j++) {                 if (temp[i].resources[j] === '') {                     results.push(temp[i]);                 }             }         }          console.log(results);          linktext === "display rows missing data"             ? vm.missingvaluesbuttontext = "show data"             : vm.missingvaluesbuttontext = "display rows missing data";      }; 

i getting error:

typeerror: cannot read property 'length' of undefined    @ listcontroller.vm.applymissingvaluesfilter (listcontroller.js:67)    @ fn (eval @ compile (angular.js:13275), <anonymous>:4:442)    @ f (angular.js:23481)    @ n.$eval (angular.js:15922)    @ n.$apply (angular.js:16022)    @ htmlanchorelement.<anonymous> (angular.js:23486)    @ htmlanchorelement.dispatch (jquery.js:4430)    @ htmlanchorelement.r.handle (jquery.js:4116) 

if console.log(temp.length) - outputs correct length.

alternatively there simpler accomplish this? have thought using regular expression, ( <td ng-repeat="res in resource.resources" | match: ^$) sure there better way using filters?

your object name resources, not resources.

kindly change temp[i].resources instead of temp[i].resources in second loop , should change line temp[i].resources[j] temp[i].resources[j]

  (var = 0; < temp.length; i++) {             (var j = 0; j < temp[i].resources.length; j++) {                 if (temp[i].resources[j] === '') {                     results.push(temp[i]);                 }             }         } 

edit:

also may need change temp[i].resources[j]==='' temp[i].resources[j].value===''


Comments

Popular posts from this blog

angular - Ionic slides - dynamically add slides before and after -

minify - Minimizing css files -

Add a dynamic header in angular 2 http provider -