使用ES6 + Angular1.5 + ui-router绑定问题

Question

这是悬挂浏览器。我相信我没有以正确的方式返回数据并且误解了一些概念，可能是时间问题？

controller.js

export default class XController {
    constructor($stateParams, YService) {

        this.getSlugByName = function(name) {
            return YService.get({name: name}).then(getSuccessFn, getFailFn);

            function getSuccessFn(data) {
                return data[0].slug;
            }

            function getFailFn() {
                console.error('Something went wrong');
            }
        }
    }
}
XController.$inject = ['$stateParams', 'YService'];

template.html

<ul>
    <li ng-repeat="each in vm.mainObject.objects"> // each is a name
    <a ui-sref="resolver({slug: vm.getSlugByName(each) })" class="btn">{{ each }}</a>
</ul>

routes.js

static resolver($stateParams, XService) {
    return XService.get({ slug: $stateParams.slug });
}

component.js

import templateUrl from './template.html';
import controller from './controller';

let xComponent = {
  restrict: 'E',
  bindings: {
    'mainObject': '<'
  },
  templateUrl: templateUrl,
  controller,
  controllerAs: 'vm'
};

export default xComponent;

更新

添加了解释objects绑定来自

的组件文件

Answer 1

我认为一个问题是你的方法在构造函数中：

export default class XController {
  constructor($stateParams, YService) {
  }

  function getSlugByName(name) {
    return YService.get({name: name}).then(getSuccessFn, getFailFn);

    function getSuccessFn(data) {
      return data[0].slug;
    }

    function getFailFn() {
      console.error('Something went wrong');
    }
  }
}

XController.$inject = ['$stateParams', 'YService'];

你的vm.objects来自哪里？

无论如何，尝试一下，看看它是否解决了你的问题。

Answer 2

我有时间问题。我搬出YService并将其作为解析器放置，这样数据将在稍后的控制器上可用。这是可能的，因为我使用的是angular-ui-router，否则我会按here

的说明尝试使用$scope.$on('$viewContentLoaded')