Как удалить неопределенную ошибку в угловых js?

0

Как удалить неопределенную ошибку в угловых js? На самом деле, я пытаюсь загрузить данные с использованием разрешения и использовать эти данные в контроллере, но на контроллере я получаю неопределенное значение почему?

resolve: {
    message: function (testservice) {
        return testservice.getdata();
    },
    message2: function (testservice) {
        return testservice.getTodo();
    },
    message3: function (testservice) {
        return testservice.getGithub();
    }
}

использовать контроллер

.controller('b', function($scope, $stateParams, $state, $ionicHistory,message) {
    console.log("controller is loaded"+message)
})

//undefined в этой консоли

console.log("controller is loaded"+message)

plinker http://plnkr.co/edit/siqCUS3jUKVQz6pxmC50?p=preview

Теги:
angular-ui-router
angularjs-scope
angularjs-directive

3 ответа

2
Лучший ответ

Я бы сказал, что вы почти там.

Просто сервис/завод должен что-то вернуть. Я имею в виду здесь:

...
message: function(testservice) {
      return testservice.getdata();
}

мы чего-то ожидаем... и ничего не было

Я добавил return data; одной строки return data; и есть обновленный плункер

.factory('testservice', ['$http',
  function testservice($http) {
    // interface

    // implementation
    function getData() {

      return $http.get("http://jsonplaceholder.typicode.com/photos")
        .then(function(data) {
          console.log(data)

          // HERE - this line was missing
          // return something here
          return data;

        }, function(error) {
          console.log(error)
        })

EXTEND: Как показать некоторый вид... загрузка... до разрешения?

Основываясь на некоторых комментариях, я привел пример здесь. В настоящее время показано это мнение:

loadingB.html

<div >
  <div ui-view="">
    <h2>...loading...</h2>
  </div>
</div>

что является взглядом на совершенно новое родительское состояние 'loadingB':

.state('loadingB', {
  redirectTo: "b",
  templateUrl : "loadingB.html",
})

Он вводит вышеуказанный вид loadB.html в положение исходного состояния "b". И он имеет одно свойство redirectTo: "b", которым управляет этот небольшой кусок кода:

.run(['$rootScope', '$state', function($rootScope, $state) {
    $rootScope.$on('$stateChangeSuccess', function(evt, to, params) {
      if (to.redirectTo) {
        evt.preventDefault();
        $state.go(to.redirectTo, params)
      }
    });
}])

И наша служба теперь использует $timeout для получения некоторой задержки:

.factory('testservice', ['$http', '$timeout',
  function testservice($http, $timeout) { 
    // interface

    // implementation
    function getData() { 

      return $http.get("http://jsonplaceholder.typicode.com/photos")
        .then(function(data) {
          console.log("resolved http")
          return $timeout(function(){
            console.log("after two seconds delay")
            return data;
          }, 2500)
        ...

И, наконец, мы должны перенаправить на loadingB здесь

$scope.moveto = function() {
    $state.go('loadingB'); 
}

А также сделать "b" ребенком "laodingB"

.state("b", {
  parent: "loadingB", 
  templateUrl: "b.html",
  url: "/b",
  controller: 'b', 
  resolve: { 
    message: function(testservice) {
      return testservice.getdata();
    },

Проверьте все здесь

  • 0
    Можем ли мы показать загрузчик до всех ответов службы
  • 0
    Мне нужно показать загрузчик, пока все данные сервиса не придут
Показать ещё 10 комментариев
1

Radim Koehler имеет правильный ответ или даже проще, просто верните обещание функции getData в службе:

function getData() { 
      return $http.get("http://jsonplaceholder.typicode.com/photos");
}
  • 0
    Точно;) В этом и заключается суть решимости - вернуть что-то;)
0

Если вы хотите разрешить состояние перед входом в просмотр, вам нужно сделать несколько вещей. решите, что вы так заявляете

.state('app.b', {
  url: "/b",
  views: {
    'menuContent': {
      templateUrl: "b.html",
      controller: 'b',
      resolve: {
        apiData: "testservice",
        itemDetailsData: function($q, apiData) {
          var item = apiData.getdata();
          if (item) {
            return $q.when(item);
          } else {
            return $q.reject();
          }
        }
      }
    }
  }
})

в ваших службах вы можете иметь заводский метод:

.factory('albumService', ['$http', '$q', '$ionicLoading', '$timeout', albumFn])
function albumFn($http, $q, $ionicLoading, $timeout) {
return {
getAlbums: function() {
  $ionicLoading.show({
    content: '<i class="icon ion-loading-d"></i>',
    animation: 'fade-in',
    showBackdrop: true,
    maxWidth: 200,
    showDelay: 5
  });

  var def = $q.defer();
  $http.get("data.json")
    .success(function(data) {
     $ionicLoading.hide();
      def.resolve(data);
    })
    .error(function() {
     $ionicLoading.hide();
      def.reject("Failed to get albums");
    });

  return def.promise;

    }
  }
 }

Я создал подобную демонстрацию plunker здесь

Ещё вопросы

Сообщество Overcoder
Наверх
Меню