javascript - 如何将函数从服务传递到 Controller 并在那里调用 Angularjs 语法 es6？

Question

当我尝试在 Controller 中调用 getTodos 函数时，它不返回任何值。我想将 getTodos() 函数返回的值分配给 this.todos 。 this.todos 返回 null

/* ----- todo/todo.service.js ----- */
   class TodosController {
   constructor(TodoService) {
    'ngInject'
    this.ArtistsListService = ArtistsListService;
   }

    $onInit() {
      this.todos = null;
      this.TodoServiceService.getTodos().then(response => 
 this.todos = response);
      console.log(this.todos);
    }
}

export default TodosController;`

<小时/>

/* ----- todo/todo.service.js ----- */
   export class TodoService {
  constructor($http) {
    'ngInject';
    this.$http = $http;
  }
  getTodos() {
    return this.$http.get('/api/todos').then(response => 
 response.data);
  }
}

<小时/>

/* ----- todo/todo.module.js ----- */
 import angular from 'angular';
 import { TodoComponent } from './todo.component';
  import { TodoService } from './todo.service';
 import './todo.scss';

 export const TodoModule = angular
  .module('todo', [])
  .component('todo', TodoComponent)
  .service('TodoService', TodoService)
  .name;

<小时/>

Answer 1

尝试:

export class TodoService {
  constructor($http) {
    'ngInject';
    this.$http = $http;
  }
  getTodos() {
    return this.$http.get('/api/todos');
  }
}

在 Controller 中:

   class TodosController {
   constructor(TodoService) {
    'ngInject'
    this.ArtistsListService = ArtistsListService;
   }

    $onInit() {
      this.todos = null;
      this.TodoServiceService.getTodos().then(response => 
        {
           this.todos = response.data;
           console.log(this.todos);
        },
        (error) => { console.error(error) }
       );

    }
}

export default TodosController;

您需要将 http promise 返回为

返回这个。$http.get('/api/todos')

在服务文件中获得 promise