What steps are involved in developing a personalized service?

Below is the controller code:

app.controller('myCtrl', function($scope, $http, $timeout) {
$scope.getData = function() {
    $http.get("../send")
        .then(function(response) {
                $scope.text = response.data;
                $scope.params = $scope.text.split(' ');
                $scope.timeFunc();
            },
            function(response) {
                $scope.timeFunc();
            });
};
$scope.timeFunc = function() {
    $timeout(function() {
        $scope.getData();
    }, 1000);
};

$scope.getData();

});

Is there a way to move this functionality out of the controller and into a separate service? The challenge here is to ensure that the variable params is updated every second.

Answer №1

app.controller('myCtrl', function ($scope, $http, $timeout, servicenName) {
$scope.getData = function () {
servicenName.getData().then(function (response) {
$scope.text = response.data;
$scope.params = $scope.text.split(' ');
$scope.timeFunc();
},
function (response) {
$scope.timeFunc();
});
};

$scope.timeFunc = function () {
$timeout(function () {
$scope.getData();
}, 1000);
};
$scope.getData();
});
app.service('servicenName', function ($http) {
this.getData = function () {
return $http.get("../send");
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for sorting data based on duplicate dates within a single array element

Here is the existing Object Array structure: [ { "date":"12-09-2019 12:00 PM", "id":"1", "name":"hello1" }, { "date":"12-09-2019 03:00 PM", "id":"2", "name":"hello2" }, { "date":"12- ...

Get the specific element at the given index from an array of elements using

I'm currently tackling a challenge with my angular e2e test project. The task at hand involves selecting the second element within an ng-repeat that has the heading "Topic - xyz" and then clicking on the button that is a sibling of this element. How s ...

How to clear a particular select option in react-bootstrap

I am looking for a solution to clear the second select when the first one selects option B. The clearing should involve removing the value, disabling it, and setting the default option to Select.... import React, { useState } from "react"; import ...

Learn the technique for displaying various content in pop-up windows when clicking on HTML links

I have a code snippet that I am using and I want to display different content when clicked. <style> #overlay_form { position: absolute; border: 5px solid gray; padding: 10px; background: white; width: 270px; height: 190px; } ...

Guide on utilizing ajax to post data when the URL parameter changes, all without refreshing the page

As the URL parameter changes, the values in my HTML also change. I am passing these values to a JSON file, but they are getting erased when the page refreshes due to the post request. I have attempted to use event.preventDefault(), however, it seems to n ...

Exploring the depths of jQuery selectors and their navigation through the DOM

How can I determine what is traversing through the DOM and what is not? $('div p') It appears that this code first selects all div elements and then searches for p elements within each of those div elements. $('div .foo') The select ...

Saving Labels in Firebase after receiving a POST request for a separate group in Node.js

My system comprises two key collections: posts and tags. The posts collection contains a postId and other relevant metadata, including tags. A typical structure of a post is as follows: { "tags": [ "tag1", "tag2", ... ], ...

What is the most efficient way to transform an array of objects into a compact string?

I'm exploring a new project with an import/export feature in mind. Initially, I will have an array containing approximately 45 simple objects structured like this: {"id": "someId", "quantity": 3} To make it exportable, t ...

Ways to convert an asynchronous operation to synchronous in JavaScript

Currently in the process of developing an eslint plugin, I have come across a particular issue. My goal is to implement real-time changes to the configuration file by making an HTTP request to retrieve the JSON configuration. When attempting to execute co ...

What could be the reason for ng-transclude not functioning as anticipated in AngularJS?

Seeking help with my simple directed isolated scope. I have followed a transclude tutorial but it's not working as expected. I want to display "dd" and a test together, how can I achieve this? var app =angular.module('app',[]); app.direc ...

I am looking for a single-page website that I can access after refreshing the page at a specific point

I recently created a one-page website with a div called sitecontent that has a width of 4400 pixels, housing four distinct "pages". These pages are located at intervals of 0px, 1100px, 2200px, and 3300px within sitecontent. To ensure the correct text is d ...

How to get the total number of rows/records in a JSON store using ExtJS?

My dilemma involves a JSON store that provides data in JSON format. I am currently attempting to determine the number of rows or records in the JSON string. However, when utilizing the store.getCount() function, it consistently returns 0. Strangely, the ...

ways to conceal icon image when the textbox is devoid of content

Is there a way to hide the clear icon from a text box if the length inside the text box is less than 1? I attempted the following code, but it didn't work for me. The inner icon is not hidden when the input field length is less than 1. For a demo ex ...

Tips for encoding data to JSON format in Angular

I am unsure if I am sending the username and password in JSON format correctly. As a beginner in Angular, I want to make sure I am doing it right. myApp.controller('loginController',['$scope','$http', function($scope, $http) ...

Convert a collection of observables containing events to an observable array of events

I am working on creating a function that merges all event streams generated from an array of data channels and emits any event received from them. Below is the initial function: private dataChannels: BehaviorSubject<RTCDataChannel[]> = new Behavi ...

Retrieving currentUser data using Vue.js, Vuex, Express, and MongoDB

I am currently working on creating a MEVN stack authentication page that displays information about the user who is logged in. After successfully logging in, the router redirects to Home.vue and passes the username as a prop. The onSubmit method in Login. ...

Show links in the sidebar menu when the primary navigation links are hovered over

I am trying to create a dynamic side menu that displays different links depending on which link is hovered over in the top navigation bar. Here is what I have so far: HTML: <ul class="nav navbar-nav"> <li class="nav"><a class="toggle" hr ...

Compiling models at the second level

I am working with a model that looks like this: { content: "Hello world, this is a sample content", notes: { content: "side note, some text here.", index: 2 } } My goal is to convert the model into the following HTML format: <div class= ...

Tips for showing data from an hour ago in Angular

Here is the code snippet provided: data = [ { 'name' : 'sample' 'date' : '2020-02-18 13:50:01' }, { 'name' : 'sample' 'date' : '2020-02- ...

What could be causing the issue with importing this JS function into my blade.php file?

I am encountering an issue with my JavaScript file, 'submittedForms.js', which I reference in my blade.php as follows: <script type="module" src="/js/bundle/charts/submittedForms.js"></script> Within the 'submittedForms.js&apos ...