Angular filtering data in javascript is not displaying results and push of data causes error plunker provided

倖福魔咒の 提交于 2019-12-12 03:48:50

问题


Ok, seems that I was having too many issues with the way in which my Angular site is setup, so I put it in a plunker as then anyone can see it.

Original question: Angular retrieve specific data into $scope variable is not working

Plunker http://plnkr.co/edit/NsE29zjraQp9UeklJBiI?p=preview

My issues are 1. i'm not understanding how to use app.filter 2. Issue with app name 3. forEach with push inside $http.get throws error not defined

The plunker Index.html has the template code loop , app.module.js is root and the device.controller.js is where I'm using controller with $http.get call using json file to fake it.

I was attempting to use the other persons answer so this code

$scope.devices = result.data.Devices;   // gives all data ... 

Filter I was wondering if this with work

<div ng-repeat="device in devices">
    {{ device.DeviceStatus }} 
</div>

Then this code I'm not sure it in the correct "place"

seems like i'm not understanding "app"

app.filter('deviceStatus', function () {
    return function (status_id) {
       var statuses = ['Old Device', 'New Device', 'Activated', 'Unactivated'];
       return statuses[status_id];
   };
});

Example filter:

<td>{{device.DeviceId | deviceStatus}}</td>

回答1:


Let me try to understand your issue.

As per your question, it seems that you have problems understanding what app is and how to use filter.

This is the working version of your plunkr. Check this url

  1. app in your project is the ng-app directive. The ng-app directive tells AngularJS that the element is the "owner" of an AngularJS application.
  2. For understanding filter functionality. check the below example.
  3. You were trying to push into $scope.statuses which is not defined yet. So first define $scope.statuses to be an empty array i.e `$scope.statuses = [];

Hope this works for you!`

// To declare a filter we pass in two parameters to app.filter

// The first parameter is the name of the filter 
// second is a function that will return another function that does the actual work of the filter

//here app is the module name of your project

app.filter('myFilter', function() {

  // In the return function, we must pass in a single parameter which will be the data we will work on.
  // We have the ability to support multiple other parameters that can be passed into the filter optionally
  return function(input, optional1, optional2) {

    var output;

    // Do filter work here

    return output;

  }

});


来源:https://stackoverflow.com/questions/39242795/angular-filtering-data-in-javascript-is-not-displaying-results-and-push-of-data

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!