Functions for abbreviating and combining strings in Javascript

Question

Functions for abbreviating and combining strings in Javascript

Looking for help to simplify and shorten a Javascript function:

$scope.doRefresh = function (){
    if($scope.bulletpointPopular){
      ArticleService.popular().then(function(data){
        $scope.articles = data;
      })
      .finally(function() {
         $scope.$broadcast('scroll.refreshComplete');
       });
    }
    else {
      ArticleService.all().then(function(data){
        $scope.articles = data;
      })
      .finally(function() {
         $scope.$broadcast('scroll.refreshComplete');
       });
    }
  };

Simplified version attempted:

$scope.doRefresh = function (){
        if($scope.bulletpointPopular){
          $scope.popular();
        }
        else {
          $scope.latest();
        }
        .finally(function() {
             $scope.$broadcast('scroll.refreshComplete');
           });
      };

Error message received:

Uncaught SyntaxError: Unexpected token .

javascript angularjs

Answer 1

Answer №1

$scope.refreshArticles = function (){
    var type = $scope.bulletpointPopular? 'popular': 'all';

    ArticleService[type]().then(function(data){
       $scope.articles = data;
    }).finally(function() {
       $scope.$broadcast('scroll.refreshComplete');
    });
};

Interesting approach. The key difference lies in the conditional statement determining which function to call on ArticleService. It's a smart move to store this decision as a variable and access it dynamically from ArticleService.

Alternatively

$scope.refreshArticles = function (){
    var promise = $scope.bulletpointPopular? ArticleService.popular(): ArticleService.all();

    promise.then(function(data){
       $scope.articles = data;
    }).finally(function() {
       $scope.$broadcast('scroll.refreshComplete');
    });
};

In this scenario, depending on the boolean value, the corresponding function is invoked to get the promise returned for resolution.

Answer 2

$scope.refreshArticles = function (){
    var type = $scope.bulletpointPopular? 'popular': 'all';

    ArticleService[type]().then(function(data){
       $scope.articles = data;
    }).finally(function() {
       $scope.$broadcast('scroll.refreshComplete');
    });
};

Interesting approach. The key difference lies in the conditional statement determining which function to call on ArticleService. It's a smart move to store this decision as a variable and access it dynamically from ArticleService.

Alternatively

$scope.refreshArticles = function (){
    var promise = $scope.bulletpointPopular? ArticleService.popular(): ArticleService.all();

    promise.then(function(data){
       $scope.articles = data;
    }).finally(function() {
       $scope.$broadcast('scroll.refreshComplete');
    });
};

In this scenario, depending on the boolean value, the corresponding function is invoked to get the promise returned for resolution.

Answer 3

Answer №2

Here is a way to achieve this:

$scope.popularPosts = function() {
    return PostService.getPopularPosts();
};
$scope.latestPosts = function() {
    return PostService.getAllPosts();
};
$scope.refreshPosts = function() {
    ($scope.showPopular ? $scope.popularPosts() : $scope.latestPosts()).then(function(data) {
        $scope.posts = data;
    }).finally(function() {
        $scope.$broadcast('scroll.refreshComplete');
    });
};

Answer 4

Here is a way to achieve this:

$scope.popularPosts = function() {
    return PostService.getPopularPosts();
};
$scope.latestPosts = function() {
    return PostService.getAllPosts();
};
$scope.refreshPosts = function() {
    ($scope.showPopular ? $scope.popularPosts() : $scope.latestPosts()).then(function(data) {
        $scope.posts = data;
    }).finally(function() {
        $scope.$broadcast('scroll.refreshComplete');
    });
};

Answer 5

Answer №3

I'm not totally clear on the reasoning behind your code, but one way to simplify it could be by creating a new method in ArticleService that takes an input parameter called bulletpointPopular. This new method would then decide whether to call the popular() or all() function based on the value of bulletpointPopular. Implementing this change would make your code shorter and cleaner.

$scope.doRefresh = function (){
    ArticleService.newMethod($scope.bulletpointPopular).then(function(data){
        $scope.articles = data;
      })
      .finally(function() {
         $scope.$broadcast('scroll.refreshComplete');
       });
};

Answer 6

I'm not totally clear on the reasoning behind your code, but one way to simplify it could be by creating a new method in ArticleService that takes an input parameter called bulletpointPopular. This new method would then decide whether to call the popular() or all() function based on the value of bulletpointPopular. Implementing this change would make your code shorter and cleaner.

$scope.doRefresh = function (){
    ArticleService.newMethod($scope.bulletpointPopular).then(function(data){
        $scope.articles = data;
      })
      .finally(function() {
         $scope.$broadcast('scroll.refreshComplete');
       });
};

Functions for abbreviating and combining strings in Javascript

Answer №1

Answer №2

Answer №3

Similar questions

Creating dynamic visual elements on a webpage using HTML: Video

Tips for ensuring a custom menu closes when clicking outside of it instead of on the menu itself

Is there a way to achieve a XNOR-like response with necessary input?

"Failure to manipulate the style of an HTML element using Vue's

What could be causing the failure of the update for this computed property in my Vue 3 application?

How can we effectively implement conditional rendering when dealing with components that are nearly identical?

An animation triggered by scrolling using the @keyframes rule

Creating adaptable HTML images by specifying width and height attributes within the image tag

What strategies can I implement to integrate Cordova with a combination of Meteor and React?

Examining AngularJS Jasmine Promises in IsolationDive into the world

Error alert: TypeScript typings issue - Naming conflict with Promise / Failure to locate name Promise

I'm looking to create a unit test for my AngularJS application

Retrieving Hyperlinks from JavaScript Object for Integration with D3-Created Table

Tips for changing the click event of a button with .on/off

Getting image blob data with Cropper Js in a Laravel controllerNeed help on how to get image blob data

Discover a non-null string within a deeply nested data structure

Creating a new version of an existing method found within a component in a Vue store.js file

Efficient - Managing numerous database connections

Populating a Listview in jqueryMobile with dynamic elements

Exploring Angular 9: Harnessing the Power of Fork Join with an Array of