Angular filtering data in javascript is not displa

2019-09-08 18:45发布

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条回答
劫难
2楼-- · 2019-09-08 19:03

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;

  }

});

查看更多
登录 后发表回答