angularjs - 访问 Controller 中的解析对象

Question

我正在拉回一些依赖于路由的数据，并且从服务器返回的 JSON 很好，但是我不确定一旦我在我的 Controller 中如何实际访问该对象。我尝试了一些不同的方法，例如将 .then() 放入解析中，但这没有用。

resolve: {
            menus: function ($http) {
                var httpSource = this.httpSource = location.protocol + '//' + location.hostname;
                const url = `${this.httpSource}/api/package/menus`;
                return $http.get(url);
            }
        }

我也试过了

resolve: {
            menus: function ($http) {
                var httpSource = this.httpSource = location.protocol + '//' + location.hostname;
                const url = `${this.httpSource}/api/package/menus`;
                var menuData;
                $http.get(url).then(response => {
                    menuData = response.data.Data;
                })
                return menuData;
            }
        }

我只是想不出如何将它加载到 Controller 属性中。

我试图遵循这个，但变量没有注入(inject)构造函数 -- https://medium.com/opinionated-angularjs/advanced-routing-and-resolves-a2fcbf874a1c#.2xzq32cwo

我尝试加载它

this.menuData = $state.current.resolve.menus;

我最终得到了这个对象。

"$http", function $stateProvider.state.state.resolve.menus($http)]

我确信我在这里缺少一些基本的东西，但作为 Angular 的新手，我没有看到它。基本上，我的对象是完整的函数定义，而不是返回数据。数据。

我的 Controller 构造函数。

static $inject = ['PackageService', '$stateParams', '$state', 'menus'];
constructor(packageService: Service.IPackageService, $stateParams, $state, DTOptionsBuilder, DTColumnDefBuilder, public logger: ILogger, public menus: any) {

Answer 1

有a working example

这应该是我们的 Controller :

namespace myNamespace 
{
    export class MyController
    {
        public MenuData: any[];

        // strict notation support, for minification
        static $inject = ['$scope', 'menus'];

        // here we will get the resolved menus
        constructor(
            protected $scope: ng.IScope, 
            protected menus: ng.IHttpPromiseCallbackArg<any>)
        {
            this.MenuData = menus.data              
        }       
    }
}

这是我们的状态

.state('home', {
      url: "/home",
      templateUrl: 'template.html',
      controller: myNamespace.MyController,
      controllerAs: 'Ctrl',
      resolve: {
       // real example returning some data from data.json
       menus: function ($http) {
         var url = "data.json";
         return $http.get(url);
       }
      }
})

现在我们可以在模板中使用上面的内容了

<pre>{{Ctrl.MenuData | json }}</pre>

查一下here in action