javascript - How to check if a model on the $scope is empty - Stack Overflow

admin管理员组

文章数量:1429035

As I'm writing my first single page Angular app, I'm facing with a challenge of populating, $scope.MyModel with duplicate data upon subsequent calls to the data service:

The first time the $scope.MyModel is empty and is populated by making a call to a data service.

This takes place in response to a menu "show ..." being selected. Subsequent to that, the user may select other menu items and look at other things, and then, return back to select the same "show..." menu item.

Once this menu item is selected again, it triggers another call to the data service, and $scope.MyModel is then appended with the duplicate set of data ing from this additional service call.

Obviously, in a single page app, the whole point is not to make any unnecessary service calls.

What is the standard way of checking and preventing such additional service calls, if a given model is already populated with data?

As I'm writing my first single page Angular app, I'm facing with a challenge of populating, $scope.MyModel with duplicate data upon subsequent calls to the data service:

The first time the $scope.MyModel is empty and is populated by making a call to a data service.

This takes place in response to a menu "show ..." being selected. Subsequent to that, the user may select other menu items and look at other things, and then, return back to select the same "show..." menu item.

Once this menu item is selected again, it triggers another call to the data service, and $scope.MyModel is then appended with the duplicate set of data ing from this additional service call.

Obviously, in a single page app, the whole point is not to make any unnecessary service calls.

What is the standard way of checking and preventing such additional service calls, if a given model is already populated with data?

• javascript
• angularjs

Share Improve this question Follow edited Feb 16, 2014 at 4:06 user229044♦ 240k4141 gold badges344344 silver badges347347 bronze badges asked Feb 16, 2014 at 4:03 Eugene GoldbergEugene Goldberg 15.6k2323 gold badges9898 silver badges179179 bronze badges 3

• Please don't use signatures or taglines in your posts. – user229044 ♦ Commented Feb 16, 2014 at 4:11
• Depends on what the type of $scope.MyModel is. If it's an Array, it should be as simple as checking $scope.MyModel.length in the service callback function, assuming the service returns the same data on each call. – godfrzero Commented Feb 16, 2014 at 4:15
• Why don't you populate it only on page load? – Shomz Commented Feb 16, 2014 at 4:44

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

Just a if..else..

if ($scope.MyModel) {
    // items have value
} else {
    // items is still null
}

Since you mentioned that the API call takes place in response to interaction with a menu, I'm assuming the returned data is an array, so correct me if I'm wrong.

There are two possibilities here though: The data returned by the API is dynamic and can change on subsequent calls, or the response data is identical for every call. Depending on which case you're dealing with, you can try one of the following:

Identical Data

$scope.MyModel = [];

// Later on, in response to user interaction
if( !$scope.MyModel.length ) {
  // We only make the API call if $scope.MyModel isn't already populated
}

Dynamic Data

// We want to replace the data in $scope.MyModel each time now
// So assuming your service parses the data to an array:

// In response to user interaction
SomeService.query(function(r) {
  $scope.MyModel = [].concat(r.MyData)
});

Obviously, in a single page app, the whole point is not to make any unnecessary service calls.

I don't think that this is mandatory, it should depend on requirements and what you want to do. In an application that is accessed by multiple users at the same time, this creates a better application by refreshing the view with latest data from server => reduce the likelihood of concurrency problems like viewing out of date data, updating out of date data which is usually done by applying a version to the data and resulting in an error from server when you try to update stale data (a row that has a version lower than the version on the server).

If you decide to check for empty and don't want to refresh with latest data. You could do it like we usually do with normal javascript. @Hasib Hasan Arnab's answer is an example of a solution.

If the expected value of $scope.MyModel is an array. You could try:

if (Array.isArray($scope.MyModel)){
}
else{
}

A polyfill for not supporting browsers:

if(!Array.isArray) {
  Array.isArray = function (vArg) {
    var isArray;

    isArray = vArg instanceof Array;

    return isArray;
  };
}

Quoted from Array.isArray.

本文标签： javascriptHow to check if a model on the scope is emptyStack Overflow